niuma-ui 2.1.6 → 2.1.8
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/CHANGELOG.md +16 -0
- package/dist/components/dialog/index.d.ts +1 -1
- package/dist/components/dialog/src/RsConfirmDialog.css +45 -26
- package/dist/components/dialog/src/RsConfirmDialog.d.ts +20 -3
- package/dist/components/dialog/src/RsConfirmDialog.impl.js +97 -17
- package/dist/components/dialog/src/RsConfirmDialog.js +1 -1
- package/dist/components/dialog/src/RsDialog.css +71 -64
- package/dist/components/dialog/src/RsDialog.impl.js +3 -1
- package/dist/components/dialog/src/RsDialog.js +1 -1
- package/dist/components/dialog/src/dialog-utils.d.ts +27 -2
- package/dist/components/dialog/src/dialog-utils.js +82 -4
- package/dist/components/terminal/src/RsTerminal.css +29 -29
- package/dist/components/terminal/src/RsTerminal.impl.js +28 -3
- package/dist/components/terminal/src/RsTerminal.js +1 -1
- package/dist/components/terminal/src/terminal-utils.js +1 -1
- package/dist/composables/createRsDialog.js +1 -0
- package/dist/index.d.ts +1 -1
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -6,6 +6,22 @@
|
|
|
6
6
|
|
|
7
7
|
## [Unreleased]
|
|
8
8
|
|
|
9
|
+
## [2.1.8] - 2026-10-10
|
|
10
|
+
|
|
11
|
+
### 修复
|
|
12
|
+
|
|
13
|
+
- `RsDialog` / `RsConfirmDialog`:外壳从 `display: contents` 改为真正的定位盒子,层叠用 `--rs-z-modal`。`display: contents` 不生成盒子,`position: fixed` 的遮罩和面板会留在编辑区、分割栏的 `isolation` 里,后绘的侧栏会盖住对话框。壳层不接收点击,遮罩和面板自己接收。不传 `teleportTo` 时仍挂到 `body`,盖住整个窗口。props、事件、插槽不变。
|
|
14
|
+
|
|
15
|
+
### 变更
|
|
16
|
+
|
|
17
|
+
- `RsConfirmDialog`:`teleportTo` 仍只决定节点挂到哪里,不改变是否盖住窗口。新增 `contain`,默认 `viewport`:`role` 为 `alertdialog`,`aria-modal` 为 `true`,焦点困在框内,锁 `body` 滚动。`contain="container"` 且 `teleportTo` 指向页面节点时,只挡住该页:`role` 为 `dialog`,`aria-modal` 为 `false`,Tab 可以到页签栏,只锁该容器的滚动;节点若是 `static`,打开期间临时设为 `relative`,关闭后还原。没有页面挂载点(省略、`body`、`html`)时退回 `viewport`,开发环境警告。页面在 KeepAlive 里被藏起时卸掉浮层、滚动锁和 `inert`,不发 `cancel`,切回来再挂上。命令式 `rsConfirm` 可传 `contain`。公开类型 `RsConfirmContain`。
|
|
18
|
+
|
|
19
|
+
## [2.1.7] - 2026-10-08
|
|
20
|
+
|
|
21
|
+
### 修复
|
|
22
|
+
|
|
23
|
+
- `RsTerminal`:页签被 keep-alive 收起后,页面上其它组件写入 `data-rs-theme` 仍会让已摘掉的终端重读 `--rs-terminal-*`。节点不在文档里时这些变量继承不到,前景落成黑色,`minimumContrastRatio` 再把正文抬成灰色。现在宿主不在文档里不写调色板;回到页签时,只有收起期间确实要重读才再采一次。采到的颜色与当前相同则不赋 `options.theme`,避免清对比度缓存并重画视口。
|
|
24
|
+
|
|
9
25
|
## [2.1.6] - 2026-10-08
|
|
10
26
|
|
|
11
27
|
### 修复
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
export { default as RsDialog } from './src/RsDialog.js';
|
|
2
2
|
export { default as RsConfirmDialog } from './src/RsConfirmDialog.js';
|
|
3
|
-
export type { RsConfirmBeforeClose, RsConfirmCloseReason, RsConfirmDialogExpose, RsConfirmDialogInstance, RsConfirmOptions, RsDialogBeforeClose, RsDialogCloseReason, RsDialogExpose, RsDialogInstance, RsDialogLayout, RsDialogWidth, RsDialogWidthPreset, } from './src/dialog-utils';
|
|
3
|
+
export type { RsConfirmBeforeClose, RsConfirmCloseReason, RsConfirmContain, RsConfirmDialogExpose, RsConfirmDialogInstance, RsConfirmOptions, RsDialogBeforeClose, RsDialogCloseReason, RsDialogExpose, RsDialogInstance, RsDialogLayout, RsDialogWidth, RsDialogWidthPreset, } from './src/dialog-utils';
|
|
4
4
|
export { isRsDialogWidthPreset, resolveDialogOverlayStyle, resolveRsDialogCssWidth, resolveRsDialogWidthPx, runRsConfirmBeforeClose, runRsDialogBeforeClose, } from './src/dialog-utils';
|
|
@@ -1,22 +1,40 @@
|
|
|
1
1
|
|
|
2
|
-
.rs-confirm-dialog[data-v-
|
|
3
|
-
display:
|
|
2
|
+
.rs-confirm-dialog[data-v-1d841d98] {
|
|
3
|
+
/* 必须生成盒子并占住根层叠上下文。display:contents 会让 fixed 子节点留在
|
|
4
|
+
祖先 isolation(编辑区 / 分割栏)里,后绘的 AI 面板会盖住确认框。 */
|
|
5
|
+
position: fixed;
|
|
6
|
+
inset: 0;
|
|
7
|
+
z-index: var(--rs-z-modal);
|
|
8
|
+
pointer-events: none;
|
|
9
|
+
}
|
|
10
|
+
.rs-confirm-dialog--container[data-v-1d841d98] {
|
|
11
|
+
position: absolute;
|
|
12
|
+
}
|
|
13
|
+
.rs-confirm-dialog--container .rs-confirm-dialog__backdrop[data-v-1d841d98],
|
|
14
|
+
.rs-confirm-dialog--container .rs-confirm-dialog__content[data-v-1d841d98] {
|
|
15
|
+
position: absolute;
|
|
16
|
+
}
|
|
17
|
+
.rs-confirm-dialog--container .rs-confirm-dialog__content[data-v-1d841d98] {
|
|
18
|
+
top: 50%;
|
|
19
|
+
max-height: calc(100% - 2rem);
|
|
20
|
+
width: calc(100% - 2 * var(--rs-dialog-inset-x, 1rem));
|
|
4
21
|
}
|
|
5
|
-
.rs-confirm-dialog__anchor[data-v-
|
|
22
|
+
.rs-confirm-dialog__anchor[data-v-1d841d98] {
|
|
6
23
|
display: none;
|
|
7
24
|
}
|
|
8
|
-
.rs-confirm-dialog__backdrop[data-v-
|
|
25
|
+
.rs-confirm-dialog__backdrop[data-v-1d841d98] {
|
|
9
26
|
position: fixed;
|
|
10
27
|
inset: 0;
|
|
11
28
|
z-index: var(--rs-z-modal);
|
|
29
|
+
pointer-events: auto;
|
|
12
30
|
background: transparent;
|
|
13
31
|
}
|
|
14
|
-
.rs-confirm-dialog__overlay[data-v-
|
|
32
|
+
.rs-confirm-dialog__overlay[data-v-1d841d98] {
|
|
15
33
|
background: var(--rs-dialog-overlay-bg);
|
|
16
34
|
backdrop-filter: blur(var(--rs-dialog-overlay-blur)) saturate(120%);
|
|
17
35
|
-webkit-backdrop-filter: blur(var(--rs-dialog-overlay-blur)) saturate(120%);
|
|
18
36
|
}
|
|
19
|
-
.rs-confirm-dialog__content[data-v-
|
|
37
|
+
.rs-confirm-dialog__content[data-v-1d841d98] {
|
|
20
38
|
position: fixed;
|
|
21
39
|
left: 50%;
|
|
22
40
|
top: calc(
|
|
@@ -24,6 +42,7 @@
|
|
|
24
42
|
(100vh - var(--rs-dialog-inset-top, 1rem) - var(--rs-dialog-inset-bottom, 1rem)) / 2
|
|
25
43
|
);
|
|
26
44
|
z-index: calc(var(--rs-z-modal) + 1);
|
|
45
|
+
pointer-events: auto;
|
|
27
46
|
display: flex;
|
|
28
47
|
gap: var(--rs-space-lg);
|
|
29
48
|
width: calc(100vw - 2 * var(--rs-dialog-inset-x, 1rem));
|
|
@@ -39,26 +58,26 @@
|
|
|
39
58
|
box-shadow: var(--rs-dialog-shadow);
|
|
40
59
|
outline: none;
|
|
41
60
|
}
|
|
42
|
-
.rs-confirm-dialog__content[data-v-
|
|
61
|
+
.rs-confirm-dialog__content[data-v-1d841d98]:focus-visible {
|
|
43
62
|
box-shadow:
|
|
44
63
|
var(--rs-dialog-shadow),
|
|
45
64
|
0 0 0 var(--rs-focus-ring-width) var(--rs-focus-ring);
|
|
46
65
|
}
|
|
47
|
-
.rs-confirm-dialog__content--sm[data-v-
|
|
66
|
+
.rs-confirm-dialog__content--sm[data-v-1d841d98] {
|
|
48
67
|
max-width: 24rem;
|
|
49
68
|
}
|
|
50
|
-
.rs-confirm-dialog__content--md[data-v-
|
|
69
|
+
.rs-confirm-dialog__content--md[data-v-1d841d98] {
|
|
51
70
|
max-width: 32rem;
|
|
52
71
|
}
|
|
53
|
-
.rs-confirm-dialog__content--lg[data-v-
|
|
72
|
+
.rs-confirm-dialog__content--lg[data-v-1d841d98] {
|
|
54
73
|
max-width: 42rem;
|
|
55
74
|
}
|
|
56
|
-
[data-rs-theme='light'] .rs-confirm-dialog__content[data-v-
|
|
75
|
+
[data-rs-theme='light'] .rs-confirm-dialog__content[data-v-1d841d98] {
|
|
57
76
|
background: color-mix(in srgb, var(--rs-dialog-bg) 94%, transparent);
|
|
58
77
|
backdrop-filter: blur(24px) saturate(180%);
|
|
59
78
|
-webkit-backdrop-filter: blur(24px) saturate(180%);
|
|
60
79
|
}
|
|
61
|
-
.rs-confirm-dialog__icon[data-v-
|
|
80
|
+
.rs-confirm-dialog__icon[data-v-1d841d98] {
|
|
62
81
|
display: inline-flex;
|
|
63
82
|
align-items: center;
|
|
64
83
|
justify-content: center;
|
|
@@ -68,47 +87,47 @@
|
|
|
68
87
|
border-radius: var(--rs-radius);
|
|
69
88
|
font-weight: var(--rs-font-weight-bold);
|
|
70
89
|
}
|
|
71
|
-
.rs-confirm-dialog__icon-glyph[data-v-
|
|
90
|
+
.rs-confirm-dialog__icon-glyph[data-v-1d841d98] {
|
|
72
91
|
width: 1.25rem;
|
|
73
92
|
height: 1.25rem;
|
|
74
93
|
display: block;
|
|
75
94
|
}
|
|
76
|
-
.rs-confirm-dialog__icon--danger[data-v-
|
|
95
|
+
.rs-confirm-dialog__icon--danger[data-v-1d841d98] {
|
|
77
96
|
background: var(--rs-danger-container);
|
|
78
97
|
color: var(--rs-on-danger-container);
|
|
79
98
|
}
|
|
80
|
-
.rs-confirm-dialog__icon--warning[data-v-
|
|
99
|
+
.rs-confirm-dialog__icon--warning[data-v-1d841d98] {
|
|
81
100
|
background: var(--rs-warning-container);
|
|
82
101
|
color: var(--rs-on-warning-container);
|
|
83
102
|
}
|
|
84
|
-
.rs-confirm-dialog__icon--success[data-v-
|
|
103
|
+
.rs-confirm-dialog__icon--success[data-v-1d841d98] {
|
|
85
104
|
background: var(--rs-success-container);
|
|
86
105
|
color: var(--rs-on-success-container);
|
|
87
106
|
}
|
|
88
|
-
.rs-confirm-dialog__icon--info[data-v-
|
|
89
|
-
.rs-confirm-dialog__icon--default[data-v-
|
|
107
|
+
.rs-confirm-dialog__icon--info[data-v-1d841d98],
|
|
108
|
+
.rs-confirm-dialog__icon--default[data-v-1d841d98] {
|
|
90
109
|
background: var(--rs-info-container);
|
|
91
110
|
color: var(--rs-on-info-container);
|
|
92
111
|
}
|
|
93
|
-
.rs-confirm-dialog__main[data-v-
|
|
112
|
+
.rs-confirm-dialog__main[data-v-1d841d98] {
|
|
94
113
|
min-width: 0;
|
|
95
114
|
flex: 1;
|
|
96
115
|
}
|
|
97
|
-
.rs-confirm-dialog__title[data-v-
|
|
116
|
+
.rs-confirm-dialog__title[data-v-1d841d98] {
|
|
98
117
|
margin: 0;
|
|
99
118
|
font-size: var(--rs-font-size-base);
|
|
100
119
|
font-weight: var(--rs-font-weight-semibold);
|
|
101
120
|
letter-spacing: -0.01em;
|
|
102
121
|
color: var(--rs-dialog-title-fg);
|
|
103
122
|
}
|
|
104
|
-
.rs-confirm-dialog__subtitle[data-v-
|
|
123
|
+
.rs-confirm-dialog__subtitle[data-v-1d841d98] {
|
|
105
124
|
margin: var(--rs-space-xs) 0 0;
|
|
106
125
|
color: var(--rs-dialog-description-fg);
|
|
107
126
|
font-size: var(--rs-font-size-sm);
|
|
108
127
|
line-height: var(--rs-line-height-normal);
|
|
109
128
|
opacity: 0.85;
|
|
110
129
|
}
|
|
111
|
-
.rs-confirm-dialog__description[data-v-
|
|
130
|
+
.rs-confirm-dialog__description[data-v-1d841d98] {
|
|
112
131
|
margin: var(--rs-space-sm) 0 0;
|
|
113
132
|
color: var(--rs-dialog-description-fg);
|
|
114
133
|
font-size: var(--rs-font-size-sm);
|
|
@@ -116,11 +135,11 @@
|
|
|
116
135
|
white-space: pre-wrap;
|
|
117
136
|
overflow-wrap: anywhere;
|
|
118
137
|
}
|
|
119
|
-
.rs-confirm-dialog__extra[data-v-
|
|
138
|
+
.rs-confirm-dialog__extra[data-v-1d841d98] {
|
|
120
139
|
margin-top: var(--rs-space-md);
|
|
121
140
|
min-width: 0;
|
|
122
141
|
}
|
|
123
|
-
.rs-confirm-dialog__footer[data-v-
|
|
142
|
+
.rs-confirm-dialog__footer[data-v-1d841d98] {
|
|
124
143
|
display: flex;
|
|
125
144
|
justify-content: flex-end;
|
|
126
145
|
flex-wrap: wrap;
|
|
@@ -132,12 +151,12 @@
|
|
|
132
151
|
border-block-start: 1px solid color-mix(in srgb, var(--rs-dialog-separator) 72%, transparent);
|
|
133
152
|
}
|
|
134
153
|
@media (prefers-reduced-motion: reduce) {
|
|
135
|
-
[data-rs-theme='light'] .rs-confirm-dialog__content[data-v-
|
|
154
|
+
[data-rs-theme='light'] .rs-confirm-dialog__content[data-v-1d841d98] {
|
|
136
155
|
backdrop-filter: none;
|
|
137
156
|
-webkit-backdrop-filter: none;
|
|
138
157
|
background: var(--rs-dialog-bg);
|
|
139
158
|
}
|
|
140
|
-
.rs-confirm-dialog__overlay[data-v-
|
|
159
|
+
.rs-confirm-dialog__overlay[data-v-1d841d98] {
|
|
141
160
|
backdrop-filter: none;
|
|
142
161
|
-webkit-backdrop-filter: none;
|
|
143
162
|
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { type Component } from 'vue';
|
|
2
|
-
import { type RsConfirmBeforeClose, type RsConfirmCloseReason, type RsDialogWidth } from './dialog-utils';
|
|
2
|
+
import { type RsConfirmContain, type RsConfirmBeforeClose, type RsConfirmCloseReason, type RsDialogWidth } from './dialog-utils';
|
|
3
3
|
import type { RsFeedbackTone } from '../../_shared/src/overlay-utils';
|
|
4
4
|
type __VLS_Props = {
|
|
5
5
|
title?: string;
|
|
@@ -30,11 +30,27 @@ type __VLS_Props = {
|
|
|
30
30
|
overlayOpacity?: number;
|
|
31
31
|
/** 遮罩模糊;number 为 px。默认主题为 0 */
|
|
32
32
|
overlayBlur?: number | string;
|
|
33
|
-
/**
|
|
33
|
+
/**
|
|
34
|
+
* 挂载目标。只决定节点挂到哪里,不改变是否盖住窗口。
|
|
35
|
+
* - undefined:挂到 body。
|
|
36
|
+
* - string / HTMLElement:挂到该节点。
|
|
37
|
+
* - false:禁用 Teleport,就地渲染。
|
|
38
|
+
*
|
|
39
|
+
* 页面在 KeepAlive 里被藏起时卸掉浮层并放开 inert,切回来再挂上。
|
|
40
|
+
*/
|
|
34
41
|
teleportTo?: string | HTMLElement | false;
|
|
42
|
+
/**
|
|
43
|
+
* 呈现范围。
|
|
44
|
+
* - viewport(默认):position:fixed,盖住窗口。aria-modal 为 true,焦点困在框内,锁 body 滚动。
|
|
45
|
+
* - container:只盖住 teleportTo 指向的页面。该节点不能是 body / html。
|
|
46
|
+
* 打开时若 position 为 static,临时设为 relative,关闭后还原。
|
|
47
|
+
* role 为 dialog,aria-modal 为 false,Tab 可以离开到页签栏,只锁该容器的滚动。
|
|
48
|
+
* 没有页面挂载点时退回 viewport,开发环境会警告。
|
|
49
|
+
*/
|
|
50
|
+
contain?: RsConfirmContain;
|
|
35
51
|
/** Esc 关闭。确认中无效。只作用于最上层。 */
|
|
36
52
|
closeOnEsc?: boolean;
|
|
37
|
-
/**
|
|
53
|
+
/** viewport 锁 body 滚动;container 只锁挂载容器。默认 true。 */
|
|
38
54
|
lockScroll?: boolean;
|
|
39
55
|
/** 覆盖 --rs-z-modal。遮罩用该值,面板 +1。 */
|
|
40
56
|
zIndex?: number;
|
|
@@ -73,6 +89,7 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, {
|
|
|
73
89
|
confirmVariant: "primary" | "danger";
|
|
74
90
|
autoCloseOnConfirm: boolean;
|
|
75
91
|
lockScroll: boolean;
|
|
92
|
+
contain: RsConfirmContain;
|
|
76
93
|
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
77
94
|
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
78
95
|
declare const _default: typeof __VLS_export;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { useRsI18n } from "../../../composables/useRsI18n.js";
|
|
2
2
|
import RsButton_default from "../../button/src/RsButton.js";
|
|
3
|
-
import { acquireDialogScrollLock, claimDialogInert, dialogLayerTick, dialogTargetOwnsTab, isRsDialogWidthPreset, isTopDialogLayer, listDialogTabbables, pushDialogLayer, releaseDialogInert, removeDialogLayer, resolveDialogOverlayStyle, resolveDialogTabTarget, resolveRsDialogCssWidth, runRsConfirmBeforeClose } from "./dialog-utils.js";
|
|
4
|
-
import { Fragment, Teleport, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, mergeModels, nextTick, normalizeClass, normalizeStyle, onBeforeUnmount, openBlock, ref, renderSlot, resolveDynamicComponent, toDisplayString, unref, useId, useModel, watch, withCtx } from "vue";
|
|
3
|
+
import { acquireContainerScrollLock, acquireDialogScrollLock, claimDialogInert, dialogLayerTick, dialogTargetOwnsTab, isRsDialogWidthPreset, isTopDialogLayer, listDialogTabbables, pinDialogContainer, pushDialogLayer, releaseDialogInert, removeDialogLayer, resolveDialogOverlayStyle, resolveDialogTabTarget, resolveRsConfirmContain, resolveRsDialogCssWidth, runRsConfirmBeforeClose } from "./dialog-utils.js";
|
|
4
|
+
import { Fragment, Teleport, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, mergeModels, nextTick, normalizeClass, normalizeStyle, onActivated, onBeforeUnmount, onDeactivated, openBlock, ref, renderSlot, resolveDynamicComponent, toDisplayString, unref, useId, useModel, watch, withCtx } from "vue";
|
|
5
5
|
//#region src/components/dialog/src/RsConfirmDialog.vue?vue&type=script&setup=true&lang.ts
|
|
6
6
|
var _hoisted_1 = [
|
|
7
7
|
"data-rs-theme",
|
|
@@ -10,6 +10,8 @@ var _hoisted_1 = [
|
|
|
10
10
|
];
|
|
11
11
|
var _hoisted_2 = [
|
|
12
12
|
"id",
|
|
13
|
+
"role",
|
|
14
|
+
"aria-modal",
|
|
13
15
|
"aria-labelledby",
|
|
14
16
|
"aria-label",
|
|
15
17
|
"aria-describedby"
|
|
@@ -60,6 +62,7 @@ var RsConfirmDialog_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/
|
|
|
60
62
|
overlayOpacity: {},
|
|
61
63
|
overlayBlur: {},
|
|
62
64
|
teleportTo: { type: [String, Boolean] },
|
|
65
|
+
contain: { default: "viewport" },
|
|
63
66
|
closeOnEsc: {
|
|
64
67
|
type: Boolean,
|
|
65
68
|
default: true
|
|
@@ -102,6 +105,7 @@ var RsConfirmDialog_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/
|
|
|
102
105
|
let closeFromInside = null;
|
|
103
106
|
let keyBound = false;
|
|
104
107
|
let releaseScroll = null;
|
|
108
|
+
let releasePosition = null;
|
|
105
109
|
let returnTo = null;
|
|
106
110
|
let inertGeneration = 0;
|
|
107
111
|
const contentClass = computed(() => {
|
|
@@ -111,6 +115,7 @@ var RsConfirmDialog_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/
|
|
|
111
115
|
if (props.zIndex == null || !Number.isFinite(props.zIndex)) return void 0;
|
|
112
116
|
return { zIndex: String(Math.round(props.zIndex) + offset) };
|
|
113
117
|
}
|
|
118
|
+
const shellStyle = computed(() => zIndexStyle(0));
|
|
114
119
|
const overlayStyle = computed(() => {
|
|
115
120
|
const visual = props.showOverlay ? resolveDialogOverlayStyle({
|
|
116
121
|
overlayOpacity: props.overlayOpacity,
|
|
@@ -147,6 +152,11 @@ var RsConfirmDialog_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/
|
|
|
147
152
|
if (target === false || target == null) return "body";
|
|
148
153
|
return target;
|
|
149
154
|
});
|
|
155
|
+
/** contain="container" 且挂载点是页面节点。否则仍盖住窗口。 */
|
|
156
|
+
const contained = computed(() => resolveRsConfirmContain(props.contain, props.teleportTo) === "container");
|
|
157
|
+
/** KeepAlive 切走时为 false。必须在 open 的 immediate watch 之前声明。 */
|
|
158
|
+
const pageActive = ref(true);
|
|
159
|
+
let presentedSuspended = false;
|
|
150
160
|
function syncChrome() {
|
|
151
161
|
const el = anchorRef.value;
|
|
152
162
|
if (!el) {
|
|
@@ -163,26 +173,47 @@ var RsConfirmDialog_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/
|
|
|
163
173
|
panelDir.value = dir === "ltr" || dir === "rtl" ? dir : void 0;
|
|
164
174
|
panelLang.value = langed?.getAttribute("lang") || void 0;
|
|
165
175
|
}
|
|
166
|
-
function
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
176
|
+
function releaseContainHost() {
|
|
177
|
+
releasePosition?.();
|
|
178
|
+
releasePosition = null;
|
|
179
|
+
}
|
|
180
|
+
function syncContainHost() {
|
|
181
|
+
if (!contained.value || !open.value || !pageActive.value) {
|
|
182
|
+
releaseContainHost();
|
|
170
183
|
return;
|
|
171
184
|
}
|
|
172
|
-
|
|
173
|
-
|
|
185
|
+
const host = shellRef.value?.parentElement;
|
|
186
|
+
if (!host || releasePosition) return;
|
|
187
|
+
releasePosition = pinDialogContainer(host);
|
|
188
|
+
}
|
|
189
|
+
function syncScrollLock() {
|
|
190
|
+
if (!(open.value && pageActive.value && props.lockScroll)) {
|
|
191
|
+
releaseScroll?.();
|
|
174
192
|
releaseScroll = null;
|
|
193
|
+
return;
|
|
194
|
+
}
|
|
195
|
+
if (releaseScroll) return;
|
|
196
|
+
if (contained.value) {
|
|
197
|
+
const host = shellRef.value?.parentElement;
|
|
198
|
+
if (!host) return;
|
|
199
|
+
releaseScroll = acquireContainerScrollLock(host);
|
|
200
|
+
return;
|
|
175
201
|
}
|
|
202
|
+
releaseScroll = acquireDialogScrollLock();
|
|
176
203
|
}
|
|
177
204
|
async function syncInert() {
|
|
178
205
|
const generation = ++inertGeneration;
|
|
179
206
|
await nextTick();
|
|
180
207
|
if (disposed || generation !== inertGeneration) return;
|
|
181
|
-
if (!(open.value && isTopDialogLayer(layerId)) || !shellRef.value) {
|
|
208
|
+
if (!(open.value && pageActive.value && isTopDialogLayer(layerId)) || !shellRef.value) {
|
|
182
209
|
releaseDialogInert(layerId);
|
|
210
|
+
releaseContainHost();
|
|
183
211
|
return;
|
|
184
212
|
}
|
|
185
|
-
|
|
213
|
+
syncContainHost();
|
|
214
|
+
syncScrollLock();
|
|
215
|
+
const boundary = contained.value ? shellRef.value.parentElement : null;
|
|
216
|
+
claimDialogInert(layerId, shellRef.value, boundary);
|
|
186
217
|
}
|
|
187
218
|
function bindKey() {
|
|
188
219
|
if (keyBound || typeof document === "undefined") return;
|
|
@@ -263,7 +294,7 @@ var RsConfirmDialog_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/
|
|
|
263
294
|
requestClose("escape");
|
|
264
295
|
return;
|
|
265
296
|
}
|
|
266
|
-
if (event.key !== "Tab" || dialogTargetOwnsTab(event.target)) return;
|
|
297
|
+
if (event.key !== "Tab" || contained.value || dialogTargetOwnsTab(event.target)) return;
|
|
267
298
|
const root = contentRef.value;
|
|
268
299
|
if (!root) return;
|
|
269
300
|
const target = resolveDialogTabTarget(root, document.activeElement, event.shiftKey);
|
|
@@ -281,6 +312,7 @@ var RsConfirmDialog_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/
|
|
|
281
312
|
syncScrollLock();
|
|
282
313
|
inertGeneration += 1;
|
|
283
314
|
releaseDialogInert(layerId);
|
|
315
|
+
releaseContainHost();
|
|
284
316
|
if (!wasOpen) return;
|
|
285
317
|
const reason = closeFromInside;
|
|
286
318
|
closeFromInside = null;
|
|
@@ -308,8 +340,46 @@ var RsConfirmDialog_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/
|
|
|
308
340
|
async function onCancelClick() {
|
|
309
341
|
await requestClose("cancel");
|
|
310
342
|
}
|
|
343
|
+
/**
|
|
344
|
+
* KeepAlive 切走页签时卸掉浮层,并放开滚动锁、inert 和 document 监听。
|
|
345
|
+
* open 保持为 true,切回来再挂上,不把这次切换当成取消。
|
|
346
|
+
*/
|
|
347
|
+
function suspendPresentedDialog() {
|
|
348
|
+
if (presentedSuspended || !open.value || disposed) return;
|
|
349
|
+
presentedSuspended = true;
|
|
350
|
+
removeDialogLayer(layerId);
|
|
351
|
+
unbindKey();
|
|
352
|
+
releaseScroll?.();
|
|
353
|
+
releaseScroll = null;
|
|
354
|
+
releaseContainHost();
|
|
355
|
+
inertGeneration += 1;
|
|
356
|
+
releaseDialogInert(layerId);
|
|
357
|
+
}
|
|
358
|
+
function resumePresentedDialog() {
|
|
359
|
+
if (!presentedSuspended || disposed) return;
|
|
360
|
+
presentedSuspended = false;
|
|
361
|
+
if (!open.value || !pageActive.value) return;
|
|
362
|
+
syncChrome();
|
|
363
|
+
pushDialogLayer(layerId);
|
|
364
|
+
bindKey();
|
|
365
|
+
syncScrollLock();
|
|
366
|
+
syncInert();
|
|
367
|
+
queueFocus();
|
|
368
|
+
}
|
|
369
|
+
onActivated(() => {
|
|
370
|
+
pageActive.value = true;
|
|
371
|
+
resumePresentedDialog();
|
|
372
|
+
});
|
|
373
|
+
onDeactivated(() => {
|
|
374
|
+
pageActive.value = false;
|
|
375
|
+
suspendPresentedDialog();
|
|
376
|
+
});
|
|
311
377
|
watch(open, (isOpen, wasOpen) => {
|
|
312
378
|
if (isOpen) {
|
|
379
|
+
if (!pageActive.value) {
|
|
380
|
+
presentedSuspended = true;
|
|
381
|
+
return;
|
|
382
|
+
}
|
|
313
383
|
if (wasOpen !== true) {
|
|
314
384
|
rememberTrigger();
|
|
315
385
|
syncChrome();
|
|
@@ -321,14 +391,22 @@ var RsConfirmDialog_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/
|
|
|
321
391
|
syncInert();
|
|
322
392
|
return;
|
|
323
393
|
}
|
|
394
|
+
presentedSuspended = false;
|
|
324
395
|
if (wasOpen === true && closeFromInside == null) {
|
|
325
396
|
vetoParentClose();
|
|
326
397
|
return;
|
|
327
398
|
}
|
|
328
399
|
finishClose(wasOpen === true);
|
|
329
400
|
}, { immediate: true });
|
|
401
|
+
watch(() => [props.contain, props.teleportTo], () => {
|
|
402
|
+
if (!open.value || !pageActive.value || disposed) return;
|
|
403
|
+
releaseScroll?.();
|
|
404
|
+
releaseScroll = null;
|
|
405
|
+
releaseContainHost();
|
|
406
|
+
syncInert();
|
|
407
|
+
});
|
|
330
408
|
watch(() => [props.lockScroll, dialogLayerTick.value], () => {
|
|
331
|
-
if (!open.value || disposed) return;
|
|
409
|
+
if (!open.value || !pageActive.value || disposed) return;
|
|
332
410
|
syncScrollLock();
|
|
333
411
|
syncInert();
|
|
334
412
|
});
|
|
@@ -340,6 +418,7 @@ var RsConfirmDialog_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/
|
|
|
340
418
|
unbindKey();
|
|
341
419
|
releaseScroll?.();
|
|
342
420
|
releaseScroll = null;
|
|
421
|
+
releaseContainHost();
|
|
343
422
|
releaseDialogInert(layerId);
|
|
344
423
|
});
|
|
345
424
|
__expose({
|
|
@@ -353,7 +432,7 @@ var RsConfirmDialog_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/
|
|
|
353
432
|
hidden: "",
|
|
354
433
|
class: "rs-confirm-dialog__anchor",
|
|
355
434
|
"aria-hidden": "true"
|
|
356
|
-
}, null, 512), open.value ? (openBlock(), createBlock(Teleport, {
|
|
435
|
+
}, null, 512), open.value && pageActive.value ? (openBlock(), createBlock(Teleport, {
|
|
357
436
|
key: 0,
|
|
358
437
|
defer: "",
|
|
359
438
|
to: teleportTarget.value,
|
|
@@ -361,7 +440,8 @@ var RsConfirmDialog_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/
|
|
|
361
440
|
}, [createElementVNode("div", {
|
|
362
441
|
ref_key: "shellRef",
|
|
363
442
|
ref: shellRef,
|
|
364
|
-
class: "rs-confirm-dialog",
|
|
443
|
+
class: normalizeClass(["rs-confirm-dialog", { "rs-confirm-dialog--container": contained.value }]),
|
|
444
|
+
style: normalizeStyle(shellStyle.value),
|
|
365
445
|
"data-rs-theme": panelTheme.value,
|
|
366
446
|
dir: panelDir.value,
|
|
367
447
|
lang: panelLang.value
|
|
@@ -376,8 +456,8 @@ var RsConfirmDialog_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/
|
|
|
376
456
|
open: "",
|
|
377
457
|
class: normalizeClass(["rs-confirm-dialog__content", contentClass.value]),
|
|
378
458
|
style: normalizeStyle(contentStyle.value),
|
|
379
|
-
role: "alertdialog",
|
|
380
|
-
"aria-modal": "true",
|
|
459
|
+
role: contained.value ? "dialog" : "alertdialog",
|
|
460
|
+
"aria-modal": contained.value ? "false" : "true",
|
|
381
461
|
"aria-labelledby": labelledBy.value,
|
|
382
462
|
"aria-label": accessibleName.value,
|
|
383
463
|
"aria-describedby": hasDescribedBy.value ? descriptionDomId.value : void 0,
|
|
@@ -429,7 +509,7 @@ var RsConfirmDialog_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/
|
|
|
429
509
|
"loading",
|
|
430
510
|
"disabled"
|
|
431
511
|
])])
|
|
432
|
-
])], 14, _hoisted_2)],
|
|
512
|
+
])], 14, _hoisted_2)], 14, _hoisted_1)], 8, ["to", "disabled"])) : createCommentVNode("", true)], 64);
|
|
433
513
|
};
|
|
434
514
|
}
|
|
435
515
|
});
|
|
@@ -3,6 +3,6 @@ import _plugin_vue_export_helper_default from "../../../_virtual/_plugin-vue_exp
|
|
|
3
3
|
import RsConfirmDialog_vue_vue_type_script_setup_true_lang_default from "./RsConfirmDialog.impl.js";
|
|
4
4
|
|
|
5
5
|
//#region src/components/dialog/src/RsConfirmDialog.vue
|
|
6
|
-
var RsConfirmDialog_default = /*#__PURE__*/ _plugin_vue_export_helper_default(RsConfirmDialog_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-
|
|
6
|
+
var RsConfirmDialog_default = /*#__PURE__*/ _plugin_vue_export_helper_default(RsConfirmDialog_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-1d841d98"]]);
|
|
7
7
|
//#endregion
|
|
8
8
|
export { RsConfirmDialog_default as default };
|