@t007/dialog 0.0.30 → 0.0.31
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.css +12 -12
- package/dist/index.d.ts +4 -4
- package/dist/index.global.js +63 -47
- package/package.json +4 -3
package/dist/index.css
CHANGED
|
@@ -37,12 +37,12 @@
|
|
|
37
37
|
--t007-dialog-button-padding-block: calc(var(--t007-dialog-unit) * 0.5);
|
|
38
38
|
--t007-dialog-button-border-radius: calc(var(--t007-dialog-unit) * 1.25);
|
|
39
39
|
--t007-dialog-button-gap: calc(var(--t007-dialog-unit) * 0.65);
|
|
40
|
-
--t007-confirm-button-color: grey;
|
|
41
|
-
--t007-confirm-button-background: var(--t007-cancel-button-color);
|
|
42
|
-
--t007-cancel-button-color: greenyellow;
|
|
43
|
-
--t007-cancel-button-background: var(--t007-confirm-button-color);
|
|
44
|
-
--t007-confirm-button-outline-color: var(--t007-cancel-button-color);
|
|
45
|
-
--t007-cancel-button-outline-color: var(--t007-cancel-button-color);
|
|
40
|
+
--t007-dialog-confirm-button-color: grey;
|
|
41
|
+
--t007-dialog-confirm-button-background: var(--t007-dialog-cancel-button-color);
|
|
42
|
+
--t007-dialog-cancel-button-color: greenyellow;
|
|
43
|
+
--t007-dialog-cancel-button-background: var(--t007-dialog-confirm-button-color);
|
|
44
|
+
--t007-dialog-confirm-button-outline-color: var(--t007-dialog-cancel-button-color);
|
|
45
|
+
--t007-dialog-cancel-button-outline-color: var(--t007-dialog-cancel-button-color);
|
|
46
46
|
}
|
|
47
47
|
:where(.t007-dialog) .t007-input-field {
|
|
48
48
|
--t007-input-color: var(--t007-dialog-message-color);
|
|
@@ -213,13 +213,13 @@ body:has(> .t007-dialog) {
|
|
|
213
213
|
transition: 100ms ease;
|
|
214
214
|
}
|
|
215
215
|
.t007-dialog-confirm-button {
|
|
216
|
-
color: var(--t007-confirm-button-color);
|
|
217
|
-
background: var(--t007-confirm-button-background);
|
|
216
|
+
color: var(--t007-dialog-confirm-button-color);
|
|
217
|
+
background: var(--t007-dialog-confirm-button-background);
|
|
218
218
|
opacity: 1;
|
|
219
219
|
}
|
|
220
220
|
.t007-dialog-cancel-button {
|
|
221
|
-
color: var(--t007-cancel-button-color);
|
|
222
|
-
background: var(--t007-cancel-button-background);
|
|
221
|
+
color: var(--t007-dialog-cancel-button-color);
|
|
222
|
+
background: var(--t007-dialog-cancel-button-background);
|
|
223
223
|
opacity: 0.9;
|
|
224
224
|
}
|
|
225
225
|
.t007-dialog button:hover {
|
|
@@ -236,8 +236,8 @@ body:has(> .t007-dialog) {
|
|
|
236
236
|
outline-width: var(--t007-button-outline-width);
|
|
237
237
|
}
|
|
238
238
|
.t007-dialog-confirm-button:focus {
|
|
239
|
-
outline-color: var(--t007-confirm-button-outline-color);
|
|
239
|
+
outline-color: var(--t007-dialog-confirm-button-outline-color);
|
|
240
240
|
}
|
|
241
241
|
.t007-dialog-cancel-button:focus {
|
|
242
|
-
outline-color: var(--t007-cancel-button-outline-color);
|
|
242
|
+
outline-color: var(--t007-dialog-cancel-button-outline-color);
|
|
243
243
|
}
|
package/dist/index.d.ts
CHANGED
|
@@ -5,15 +5,15 @@ import type { FieldOptions } from "@t007/input";
|
|
|
5
5
|
export interface DialogOptions {
|
|
6
6
|
/** Unique identifier for the dialog for programmatic dismissal. Auto-generated by default. */
|
|
7
7
|
id?: string;
|
|
8
|
-
/** Text for the confirmation button.
|
|
8
|
+
/** Text for the confirmation button. @default "OK". */
|
|
9
9
|
confirmText?: string;
|
|
10
|
-
/** Text for the cancel button where applicable.
|
|
10
|
+
/** Text for the cancel button where applicable. @default "Cancel". */
|
|
11
11
|
cancelText?: string;
|
|
12
|
-
/** Browser behavior for handling dialog closure.
|
|
12
|
+
/** Browser behavior for handling dialog closure. @default "any". */
|
|
13
13
|
closedBy?: HTMLDialogElement["closedBy"];
|
|
14
14
|
/** Render dialog inside a specific root element instead of document body. */
|
|
15
15
|
rootElement?: HTMLElement;
|
|
16
|
-
/** Whether to restrict interactions to `rootElement` if provided.
|
|
16
|
+
/** Whether to restrict interactions to `rootElement` if provided. @default `true`. */
|
|
17
17
|
scoped?: boolean;
|
|
18
18
|
}
|
|
19
19
|
|
package/dist/index.global.js
CHANGED
|
@@ -1,16 +1,32 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
(() => {
|
|
3
|
-
// ../../../sia-reactor/dist/chunk-
|
|
3
|
+
// ../../../sia-reactor/dist/chunk-JGEI2Q4M.js
|
|
4
4
|
function clamp(min = 0, val, max = Infinity) {
|
|
5
5
|
return Math.min(Math.max(val, min), max);
|
|
6
6
|
}
|
|
7
7
|
|
|
8
|
-
// ../../../sia-reactor/dist/chunk-
|
|
8
|
+
// ../../../sia-reactor/dist/chunk-243U74PP.js
|
|
9
|
+
function onAllMethods(owner, callback, skipOwn = true, nested = false) {
|
|
10
|
+
let proto = owner;
|
|
11
|
+
while (proto && proto !== Object.prototype) {
|
|
12
|
+
for (const method of Object.getOwnPropertyNames(proto)) {
|
|
13
|
+
if (method === "constructor") continue;
|
|
14
|
+
if (nested && skipOwn && Object.prototype.hasOwnProperty.call(owner, method)) continue;
|
|
15
|
+
if ("function" === typeof Object.getOwnPropertyDescriptor(proto, method)?.value) callback(method, owner);
|
|
16
|
+
}
|
|
17
|
+
proto = Object.getPrototypeOf(proto), nested = true;
|
|
18
|
+
}
|
|
19
|
+
}
|
|
20
|
+
function bindAllMethods(owner) {
|
|
21
|
+
onAllMethods(owner, (method, owner2) => {
|
|
22
|
+
owner2[method] = owner2[method].bind(owner2);
|
|
23
|
+
});
|
|
24
|
+
}
|
|
9
25
|
function createEl(tag, props, dataset, styles, el = tag ? document?.createElement(tag) : null) {
|
|
10
|
-
return assignEl(el, props, dataset, styles)
|
|
26
|
+
return assignEl(el, props, dataset, styles);
|
|
11
27
|
}
|
|
12
28
|
function assignEl(el, props, dataset, styles) {
|
|
13
|
-
if (!el) return;
|
|
29
|
+
if (!el) return null;
|
|
14
30
|
if (props) {
|
|
15
31
|
for (const k of Object.keys(props)) if (props[k] !== void 0) el[k] = props[k];
|
|
16
32
|
}
|
|
@@ -20,75 +36,71 @@
|
|
|
20
36
|
if (styles) {
|
|
21
37
|
for (const k of Object.keys(styles)) if (styles[k] !== void 0) el.style[k] = styles[k];
|
|
22
38
|
}
|
|
39
|
+
return el;
|
|
23
40
|
}
|
|
24
41
|
function getActiveEl(root) {
|
|
25
42
|
const activeEl = (root ?? document).activeElement;
|
|
26
43
|
return !activeEl ? null : activeEl.shadowRoot ? getActiveEl(activeEl.shadowRoot) : activeEl;
|
|
27
44
|
}
|
|
28
45
|
|
|
29
|
-
// ../../../sia-reactor/dist/chunk-
|
|
30
|
-
function onAllMethods(owner, callback, skipOwn = true, nested = false) {
|
|
31
|
-
let proto = owner;
|
|
32
|
-
while (proto && proto !== Object.prototype) {
|
|
33
|
-
for (const method of Object.getOwnPropertyNames(proto)) {
|
|
34
|
-
if (method === "constructor") continue;
|
|
35
|
-
if (nested && skipOwn && Object.prototype.hasOwnProperty.call(owner, method)) continue;
|
|
36
|
-
if ("function" === typeof Object.getOwnPropertyDescriptor(proto, method)?.value) callback(method, owner);
|
|
37
|
-
}
|
|
38
|
-
proto = Object.getPrototypeOf(proto), nested = true;
|
|
39
|
-
}
|
|
40
|
-
}
|
|
41
|
-
function bindAllMethods(owner) {
|
|
42
|
-
onAllMethods(owner, (method, owner2) => {
|
|
43
|
-
owner2[method] = owner2[method].bind(owner2);
|
|
44
|
-
});
|
|
45
|
-
}
|
|
46
|
-
|
|
47
|
-
// ../../../sia-reactor/dist/chunk-4PLMBUCP.js
|
|
48
|
-
var CTX = {
|
|
49
|
-
/** Flag indicating whether the application is running in development mode. */
|
|
50
|
-
isDevEnv: "undefined" !== typeof process ? process.env.NODE_ENV !== "production" : true,
|
|
51
|
-
/** Flag indicating whether a cascade is currently ongoing so reactors can allow all writes. */
|
|
52
|
-
isCascading: false,
|
|
53
|
-
/** Active `Autotracker` instance, override for automatic dependency collection on `Reactor` traps. */
|
|
54
|
-
autotracker: null
|
|
55
|
-
};
|
|
46
|
+
// ../../../sia-reactor/dist/chunk-2ZYYYSZ4.js
|
|
56
47
|
var RTR_BATCH = "undefined" !== typeof window ? ("undefined" !== typeof queueMicrotask ? queueMicrotask : setTimeout).bind(window) : "undefined" !== typeof process && process.nextTick ? process.nextTick : setTimeout;
|
|
57
48
|
var RTR_LOG = console.log.bind(console, "[S.I.A Reactor]");
|
|
58
49
|
var NIL = Object.freeze({});
|
|
59
50
|
var NOOP = () => {
|
|
60
51
|
};
|
|
52
|
+
var CTX = {
|
|
53
|
+
/** Flag indicating whether the application is running in development mode. */
|
|
54
|
+
isDevEnv: "undefined" !== typeof process ? process.env.NODE_ENV !== "production" : true,
|
|
55
|
+
/** Flag indicating whether an operation is bypassing checks so reactors can allow all writes. */
|
|
56
|
+
usingForce: false,
|
|
57
|
+
/** Active `Autotracker` instance, override for automatic dependency collection on `Reactor` traps. */
|
|
58
|
+
autotracker: null,
|
|
59
|
+
/** Extensible meta context for payloads and cross-cutting concerns. */
|
|
60
|
+
meta: null,
|
|
61
|
+
/** Default configuration for new `Reactor` instances and also fallback for utils that need and are called without these options. */
|
|
62
|
+
defaults: {
|
|
63
|
+
crossRealms: false,
|
|
64
|
+
smartCloning: false,
|
|
65
|
+
eventBubbling: true,
|
|
66
|
+
eventCapturing: "auto",
|
|
67
|
+
lineageTracing: false,
|
|
68
|
+
preserveContext: false,
|
|
69
|
+
equalityFunction: Object.is,
|
|
70
|
+
batchingFunction: RTR_BATCH
|
|
71
|
+
}
|
|
72
|
+
};
|
|
61
73
|
|
|
62
|
-
// ../utils/dist/chunk-
|
|
63
|
-
var INTERACTIVE_SELECTOR = ":is(button,[href],input:not([type='hidden']),select,textarea,details>summary,[contenteditable
|
|
74
|
+
// ../utils/dist/chunk-HGUYOV3P.js
|
|
75
|
+
var INTERACTIVE_SELECTOR = ":is(button,[href],input:not([type='hidden']),select,textarea,details>summary,[contenteditable],iframe,audio[controls],video[controls],[tabindex]):not([disabled],[tabindex='-1'],[data-focus-guard],[inert],[inert] *)";
|
|
64
76
|
var isInteractive = (target) => target instanceof HTMLElement && target.matches(INTERACTIVE_SELECTOR);
|
|
65
77
|
var VIRTUAL_RESOURCE = /* @__PURE__ */ Symbol.for("T007_VIRTUAL_RESOURCE");
|
|
66
|
-
function loadResource(req, type = "style", { module, media, crossOrigin, integrity, referrerPolicy, nonce, fetchPriority, attempts = 3, retryKey = false } = {},
|
|
67
|
-
|
|
78
|
+
function loadResource(req, type = "style", { module, media, crossOrigin, integrity, referrerPolicy, nonce, fetchPriority, attempts = 3, retryKey = false } = {}, win = window) {
|
|
79
|
+
win.t007 ??= {}, win.t007._resourceCache ??= {};
|
|
68
80
|
if (req === VIRTUAL_RESOURCE || isSym(req)) return Promise.resolve();
|
|
69
81
|
const src = req;
|
|
70
|
-
if (
|
|
71
|
-
const existing = type === "script" ? Array.prototype.find.call(
|
|
72
|
-
if (existing) return
|
|
73
|
-
|
|
82
|
+
if (win.t007._resourceCache[src]) return win.t007._resourceCache[src];
|
|
83
|
+
const existing = type === "script" ? Array.prototype.find.call(win.document.scripts, (s) => isSameURL(s.src, src)) : type === "style" ? Array.prototype.find.call(win.document.styleSheets, (s) => isSameURL(s.href, src)) : null;
|
|
84
|
+
if (existing) return win.t007._resourceCache[src] = Promise.resolve(existing);
|
|
85
|
+
win.t007._resourceCache[src] = new Promise((resolve, reject) => {
|
|
74
86
|
(function tryLoad(remaining, el) {
|
|
75
87
|
const onerror = () => {
|
|
76
88
|
el?.remove?.();
|
|
77
89
|
if (remaining > 1) {
|
|
78
90
|
setTimeout(tryLoad, 1e3, remaining - 1);
|
|
79
|
-
console.warn(`Retrying ${type} load (${attempts - remaining + 1})
|
|
91
|
+
console.warn(`Retrying ${type} load for "${src}" (${attempts - remaining + 1})...`);
|
|
80
92
|
} else {
|
|
81
|
-
delete
|
|
82
|
-
reject(new Error(`${type} load failed
|
|
93
|
+
delete win.t007._resourceCache[src];
|
|
94
|
+
reject(new Error(`${capitalize(type)} load failed for "${src}" after ${attempts - 1} attempts`));
|
|
83
95
|
}
|
|
84
96
|
};
|
|
85
97
|
const url = retryKey && remaining < attempts ? `${src}${src.includes("?") ? "&" : "?"}_${retryKey}=${Date.now()}` : src;
|
|
86
|
-
if (type === "script")
|
|
87
|
-
else if (type === "style")
|
|
98
|
+
if (type === "script") win.document.body.append(el = createEl("script", { src: url, type: module ? "module" : "text/javascript", crossOrigin, integrity, referrerPolicy, nonce, fetchPriority, onload: () => resolve(el), onerror }) || "");
|
|
99
|
+
else if (type === "style") win.document.head.append(el = createEl("link", { rel: "stylesheet", href: url, media, crossOrigin, integrity, referrerPolicy, nonce, fetchPriority, onload: () => resolve(el), onerror }) || "");
|
|
88
100
|
else reject(new Error(`Unsupported resource type: ${type}`));
|
|
89
101
|
})(attempts);
|
|
90
102
|
});
|
|
91
|
-
return
|
|
103
|
+
return win.t007._resourceCache[src];
|
|
92
104
|
}
|
|
93
105
|
function isDef(val) {
|
|
94
106
|
return "undefined" !== typeof val;
|
|
@@ -102,6 +114,9 @@
|
|
|
102
114
|
function uid(prefix = "") {
|
|
103
115
|
return prefix + Date.now().toString(36) + "_" + performance.now().toString(36).replace(".", "") + "_" + Math.random().toString(36).slice(2);
|
|
104
116
|
}
|
|
117
|
+
function capitalize(word = "") {
|
|
118
|
+
return word.replace(/^(\s*)([a-z])/i, (_, s, l) => s + l.toUpperCase());
|
|
119
|
+
}
|
|
105
120
|
function parseCSSTime(time) {
|
|
106
121
|
return time?.endsWith?.("ms") ? parseFloat(time) : parseFloat(time) * 1e3;
|
|
107
122
|
}
|
|
@@ -114,6 +129,7 @@
|
|
|
114
129
|
}
|
|
115
130
|
}
|
|
116
131
|
function isSameURL(url1, url2) {
|
|
132
|
+
if (url1 === url2) return true;
|
|
117
133
|
if (!isStr(url1) || !isStr(url2) || !url1 || !url2) return false;
|
|
118
134
|
return cleanURL(url1) === cleanURL(url2);
|
|
119
135
|
}
|
|
@@ -127,7 +143,7 @@
|
|
|
127
143
|
window.T007_DIALOG_CSS_SRC ??= `https://cdn.jsdelivr.net/npm/@t007/dialog@latest/dist/index.min.css`;
|
|
128
144
|
}
|
|
129
145
|
|
|
130
|
-
// ../utils/dist/chunk-
|
|
146
|
+
// ../utils/dist/chunk-ZRCBB5P4.js
|
|
131
147
|
function initOutsideClick(el, { enabled = false, onOutside = NOOP, outOnClick = true, outOnEscape = true, outOnFocusOut = false, allowBounds = false, allowInputs = false, root = window, scoped = true, capture = true } = NIL) {
|
|
132
148
|
const stacks = t007._outsiders_stacks ??= /* @__PURE__ */ new WeakMap(), existing = (t007._outsiders ??= /* @__PURE__ */ new WeakMap()).get(el);
|
|
133
149
|
if (!enabled || existing) return existing ? existing : void 0;
|
|
@@ -240,7 +256,7 @@
|
|
|
240
256
|
rtl: null,
|
|
241
257
|
grid: {},
|
|
242
258
|
activeClass: "focus-outlined",
|
|
243
|
-
inputSelector: "input,textarea,[contenteditable
|
|
259
|
+
inputSelector: "input,textarea,[contenteditable]",
|
|
244
260
|
focusOptions: { preventScroll: false },
|
|
245
261
|
scrollIntoView: { block: "nearest", inline: "nearest" },
|
|
246
262
|
onSelect: NOOP,
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@t007/dialog",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.31",
|
|
4
4
|
"description": "A lightweight, pure JS dialog system.",
|
|
5
5
|
"author": "Oketade Oluwatobiloba <tobioketade007@gmail.com>",
|
|
6
6
|
"license": "MIT",
|
|
@@ -21,7 +21,8 @@
|
|
|
21
21
|
"types": "./dist/index.d.ts",
|
|
22
22
|
"style": "./dist/index.css",
|
|
23
23
|
"sideEffects": [
|
|
24
|
-
"
|
|
24
|
+
"**/*.css",
|
|
25
|
+
"**/*.scss"
|
|
25
26
|
],
|
|
26
27
|
"exports": {
|
|
27
28
|
".": {
|
|
@@ -56,7 +57,7 @@
|
|
|
56
57
|
"accessible"
|
|
57
58
|
],
|
|
58
59
|
"dependencies": {
|
|
59
|
-
"@t007/utils": "^0.0.
|
|
60
|
+
"@t007/utils": "^0.0.34"
|
|
60
61
|
},
|
|
61
62
|
"devDependencies": {
|
|
62
63
|
"esbuild-sass-plugin": "^3.7.0"
|