pith-ui 0.1.1 → 0.1.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/AI.md +12 -1
- package/API.md +347 -192
- package/README.md +3 -1
- package/dist/composer.d.ts.map +1 -1
- package/dist/composer.js +37 -27
- package/dist/composer.js.map +1 -1
- package/dist/content/conversation-reader.d.ts.map +1 -1
- package/dist/content/conversation-reader.js +8 -1
- package/dist/content/conversation-reader.js.map +1 -1
- package/dist/content/conversation-view.d.ts.map +1 -1
- package/dist/content/conversation-view.js +34 -8
- package/dist/content/conversation-view.js.map +1 -1
- package/dist/content/image-viewer.d.ts.map +1 -1
- package/dist/content/image-viewer.js +11 -3
- package/dist/content/image-viewer.js.map +1 -1
- package/dist/content/paged-preview.d.ts +1 -1
- package/dist/content/paged-preview.d.ts.map +1 -1
- package/dist/content/paged-preview.js +4 -2
- package/dist/content/paged-preview.js.map +1 -1
- package/dist/content/views.d.ts +3 -0
- package/dist/content/views.d.ts.map +1 -1
- package/dist/content/views.js +110 -41
- package/dist/content/views.js.map +1 -1
- package/dist/content/welcome.d.ts.map +1 -1
- package/dist/content/welcome.js +5 -2
- package/dist/content/welcome.js.map +1 -1
- package/dist/dom.js +1 -1
- package/dist/dom.js.map +1 -1
- package/dist/files/panels.d.ts +2 -0
- package/dist/files/panels.d.ts.map +1 -1
- package/dist/files/panels.js +202 -128
- package/dist/files/panels.js.map +1 -1
- package/dist/files/systems.d.ts.map +1 -1
- package/dist/files/systems.js +37 -64
- package/dist/files/systems.js.map +1 -1
- package/dist/forms/actions.d.ts +23 -2
- package/dist/forms/actions.d.ts.map +1 -1
- package/dist/forms/actions.js +53 -25
- package/dist/forms/actions.js.map +1 -1
- package/dist/forms/custom-connection.d.ts.map +1 -1
- package/dist/forms/custom-connection.js +3 -2
- package/dist/forms/custom-connection.js.map +1 -1
- package/dist/forms/history.d.ts +1 -1
- package/dist/forms/history.d.ts.map +1 -1
- package/dist/forms/history.js +78 -15
- package/dist/forms/history.js.map +1 -1
- package/dist/forms/identity.d.ts.map +1 -1
- package/dist/forms/identity.js +9 -25
- package/dist/forms/identity.js.map +1 -1
- package/dist/forms/model-editor.js +3 -3
- package/dist/forms/model-editor.js.map +1 -1
- package/dist/forms/panels.d.ts +9 -2
- package/dist/forms/panels.d.ts.map +1 -1
- package/dist/forms/panels.js +79 -88
- package/dist/forms/panels.js.map +1 -1
- package/dist/forms/provider-login.d.ts.map +1 -1
- package/dist/forms/provider-login.js +20 -36
- package/dist/forms/provider-login.js.map +1 -1
- package/dist/forms/resource-editor.js +5 -4
- package/dist/forms/resource-editor.js.map +1 -1
- package/dist/foundations.d.ts +1 -1
- package/dist/foundations.d.ts.map +1 -1
- package/dist/foundations.js +22 -38
- package/dist/foundations.js.map +1 -1
- package/dist/navigation/context-menu.d.ts +7 -1
- package/dist/navigation/context-menu.d.ts.map +1 -1
- package/dist/navigation/context-menu.js +60 -57
- package/dist/navigation/context-menu.js.map +1 -1
- package/dist/navigation/navigation.d.ts +13 -0
- package/dist/navigation/navigation.d.ts.map +1 -1
- package/dist/navigation/navigation.js +96 -130
- package/dist/navigation/navigation.js.map +1 -1
- package/dist/operation.d.ts +12 -0
- package/dist/operation.d.ts.map +1 -0
- package/dist/operation.js +49 -0
- package/dist/operation.js.map +1 -0
- package/dist/primitives.d.ts +8 -1
- package/dist/primitives.d.ts.map +1 -1
- package/dist/primitives.js +114 -143
- package/dist/primitives.js.map +1 -1
- package/dist/reconcile.d.ts +11 -0
- package/dist/reconcile.d.ts.map +1 -0
- package/dist/reconcile.js +36 -0
- package/dist/reconcile.js.map +1 -0
- package/dist/select.d.ts +14 -0
- package/dist/select.d.ts.map +1 -0
- package/dist/select.js +304 -0
- package/dist/select.js.map +1 -0
- package/dist/styles.css +435 -369
- package/dist/surface.d.ts +31 -0
- package/dist/surface.d.ts.map +1 -1
- package/dist/surface.js +193 -3
- package/dist/surface.js.map +1 -1
- package/dist/tasks/approval.d.ts.map +1 -1
- package/dist/tasks/approval.js +83 -45
- package/dist/tasks/approval.js.map +1 -1
- package/dist/tasks/permission-element.d.ts +3 -0
- package/dist/tasks/permission-element.d.ts.map +1 -0
- package/dist/tasks/permission-element.js +10 -0
- package/dist/tasks/permission-element.js.map +1 -0
- package/dist/tasks/permission.d.ts.map +1 -1
- package/dist/tasks/permission.js +37 -18
- package/dist/tasks/permission.js.map +1 -1
- package/dist/tasks/runtime.d.ts.map +1 -1
- package/dist/tasks/runtime.js +30 -13
- package/dist/tasks/runtime.js.map +1 -1
- package/dist/workspace.d.ts.map +1 -1
- package/dist/workspace.js +93 -40
- package/dist/workspace.js.map +1 -1
- package/package.json +1 -1
package/dist/primitives.d.ts
CHANGED
|
@@ -105,14 +105,18 @@ export interface SelectState extends FieldState {
|
|
|
105
105
|
}
|
|
106
106
|
export interface SelectOptions extends SelectState {
|
|
107
107
|
value?: string;
|
|
108
|
+
values?: readonly string[];
|
|
108
109
|
onChange?: (value: string) => void;
|
|
110
|
+
onValuesChange?: (values: readonly string[]) => void;
|
|
109
111
|
multiple?: boolean;
|
|
110
112
|
size?: number;
|
|
111
113
|
}
|
|
112
114
|
export interface SelectBlock extends UIBlock<SelectState> {
|
|
113
115
|
readonly control: HTMLSelectElement;
|
|
114
116
|
getValue(): string;
|
|
117
|
+
getValues(): string[];
|
|
115
118
|
reset(value: string): void;
|
|
119
|
+
resetValues(values: readonly string[]): void;
|
|
116
120
|
focus(): void;
|
|
117
121
|
}
|
|
118
122
|
export declare function createSelect(options: SelectOptions): SelectBlock;
|
|
@@ -306,5 +310,8 @@ export interface MenuItem {
|
|
|
306
310
|
export interface MenuState extends PopoverState {
|
|
307
311
|
items: readonly MenuItem[];
|
|
308
312
|
}
|
|
309
|
-
export
|
|
313
|
+
export interface MenuOptions extends MenuState {
|
|
314
|
+
onError?: (message: string) => void;
|
|
315
|
+
}
|
|
316
|
+
export declare function createMenu(options: MenuOptions): PopoverBlock & UIBlock<MenuState>;
|
|
310
317
|
//# sourceMappingURL=primitives.d.ts.map
|
package/dist/primitives.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"primitives.d.ts","sourceRoot":"","sources":["../src/primitives.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;
|
|
1
|
+
{"version":3,"file":"primitives.d.ts","sourceRoot":"","sources":["../src/primitives.ts"],"names":[],"mappings":"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"}
|
package/dist/primitives.js
CHANGED
|
@@ -1,7 +1,9 @@
|
|
|
1
1
|
import { Generation, Lifetime } from './core.js';
|
|
2
2
|
import { element, iconElement, setText, uniqueId } from './dom.js';
|
|
3
3
|
import { adoptAction, adoptActionLayout, adoptFeedback, adoptNativeControl, reconcileSelectOptions } from './foundations.js';
|
|
4
|
-
import { installDialogLifecycle, installMenuNavigation } from './surface.js';
|
|
4
|
+
import { installAnchoredSurface, installDialogLifecycle, installMenuNavigation } from './surface.js';
|
|
5
|
+
import { reconcileKeyed } from './reconcile.js';
|
|
6
|
+
import { createOperation } from './operation.js';
|
|
5
7
|
export function createButton(options) {
|
|
6
8
|
const node = element('button', 'pui-button');
|
|
7
9
|
node.type = options.type ?? 'button';
|
|
@@ -72,24 +74,10 @@ export function createKeyValue(options) {
|
|
|
72
74
|
const root = element('dl', 'pui-key-value');
|
|
73
75
|
const rows = new Map();
|
|
74
76
|
const update = (state) => {
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
rows.delete(key);
|
|
80
|
-
}
|
|
81
|
-
for (const item of state.items) {
|
|
82
|
-
let row = rows.get(item.key);
|
|
83
|
-
if (!row) {
|
|
84
|
-
const label = element('dt');
|
|
85
|
-
const value = element('dd');
|
|
86
|
-
row = { node: element('div', '', label, value), label, value };
|
|
87
|
-
rows.set(item.key, row);
|
|
88
|
-
}
|
|
89
|
-
setText(row.label, item.label);
|
|
90
|
-
setText(row.value, item.value);
|
|
91
|
-
root.append(row.node);
|
|
92
|
-
}
|
|
77
|
+
reconcileKeyed(root, rows, state.items, { key: item => item.key, element: row => row.node,
|
|
78
|
+
create() { const label = element('dt'), value = element('dd'); return { node: element('div', '', label, value), label, value }; },
|
|
79
|
+
update(row, item) { setText(row.label, item.label); setText(row.value, item.value); }, destroy() { },
|
|
80
|
+
});
|
|
93
81
|
};
|
|
94
82
|
update(options);
|
|
95
83
|
return { element: root, update, destroy() { rows.clear(); } };
|
|
@@ -143,6 +131,7 @@ function textControl(options, type) {
|
|
|
143
131
|
}
|
|
144
132
|
if (options.autocomplete)
|
|
145
133
|
control.setAttribute('autocomplete', options.autocomplete);
|
|
134
|
+
control.defaultValue = options.value ?? '';
|
|
146
135
|
control.value = options.value ?? '';
|
|
147
136
|
const field = createField({ ...options, control });
|
|
148
137
|
const input = adoptNativeControl(control, { onInput: options.onInput, onChange: options.onChange });
|
|
@@ -176,6 +165,7 @@ export function createSecretInput(options) {
|
|
|
176
165
|
block.update = state => { update(state); toggle.update({ label: control.type === 'password' ? 'Show' : 'Hide', disabled: state.disabled }); };
|
|
177
166
|
const destroy = block.destroy;
|
|
178
167
|
block.destroy = () => { destroy(); toggle.destroy(); };
|
|
168
|
+
block.update(options);
|
|
179
169
|
return block;
|
|
180
170
|
}
|
|
181
171
|
export function createSelect(options) {
|
|
@@ -184,28 +174,52 @@ export function createSelect(options) {
|
|
|
184
174
|
if (options.size)
|
|
185
175
|
control.size = options.size;
|
|
186
176
|
const field = createField({ ...options, control });
|
|
187
|
-
|
|
177
|
+
let disposed = false;
|
|
178
|
+
const getValues = () => [...control.selectedOptions].map(option => option.value);
|
|
179
|
+
const input = adoptNativeControl(control, { onChange: () => { options.onChange?.(control.value); options.onValuesChange?.(getValues()); } });
|
|
180
|
+
const resetValues = (values) => {
|
|
181
|
+
if (disposed)
|
|
182
|
+
return;
|
|
183
|
+
if (!control.multiple) {
|
|
184
|
+
input.reset(values[0] ?? '');
|
|
185
|
+
return;
|
|
186
|
+
}
|
|
187
|
+
const selected = new Set(values);
|
|
188
|
+
for (const option of control.options)
|
|
189
|
+
option.selected = selected.has(option.value);
|
|
190
|
+
input.update({});
|
|
191
|
+
};
|
|
188
192
|
let signature = '';
|
|
189
193
|
const update = (state) => {
|
|
194
|
+
if (disposed)
|
|
195
|
+
return;
|
|
190
196
|
field.update(state);
|
|
191
197
|
control.classList.toggle('pui-compact', state.density === 'compact');
|
|
192
198
|
const next = JSON.stringify(state.options);
|
|
193
199
|
if (next !== signature) {
|
|
194
200
|
signature = next;
|
|
195
201
|
reconcileSelectOptions(control, state.options);
|
|
196
|
-
if (!control.multiple && control.selectedIndex < 0
|
|
197
|
-
control.selectedIndex =
|
|
202
|
+
if (!control.multiple && control.selectedIndex < 0)
|
|
203
|
+
control.selectedIndex = [...control.options].findIndex(option => !option.disabled);
|
|
198
204
|
}
|
|
205
|
+
input.update({});
|
|
199
206
|
};
|
|
200
207
|
update(options);
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
208
|
+
const initial = options.values ?? (options.value == null ? undefined : [options.value]);
|
|
209
|
+
if (initial) {
|
|
210
|
+
const selected = new Set(control.multiple ? initial : initial.slice(0, 1));
|
|
211
|
+
for (const option of control.options)
|
|
212
|
+
option.defaultSelected = selected.has(option.value);
|
|
213
|
+
resetValues(initial);
|
|
214
|
+
}
|
|
215
|
+
return { element: field.element, control, update, getValue: input.getValue, getValues,
|
|
216
|
+
reset: input.reset, resetValues, focus: input.focus, destroy() { if (disposed)
|
|
217
|
+
return; disposed = true; input.destroy(); field.destroy(); } };
|
|
205
218
|
}
|
|
206
219
|
export function createCheckbox(options) {
|
|
207
220
|
const control = element('input');
|
|
208
221
|
control.type = 'checkbox';
|
|
222
|
+
control.defaultChecked = !!options.checked;
|
|
209
223
|
control.checked = !!options.checked;
|
|
210
224
|
const caption = element('span');
|
|
211
225
|
const description = element('small');
|
|
@@ -387,7 +401,8 @@ export function createTextEditDialog(options = {}) {
|
|
|
387
401
|
const field = element('div', 'pui-field', label, control);
|
|
388
402
|
const note = element('p', 'pui-muted');
|
|
389
403
|
const error = createNotice({ message: '', tone: 'error' });
|
|
390
|
-
const cancel = createButton({ label: 'Cancel', onAction() {
|
|
404
|
+
const cancel = createButton({ label: 'Cancel', onAction() { if (!state.closeDisabled)
|
|
405
|
+
dialog.close(); } });
|
|
391
406
|
const submit = createButton({ label: options.submitLabel ?? 'Save', intent: 'primary', type: 'submit' });
|
|
392
407
|
const actions = createActions({ children: [cancel.element, submit.element] });
|
|
393
408
|
const form = element('form', 'pui-text-edit', field, note, error.element, actions.element);
|
|
@@ -400,11 +415,10 @@ export function createTextEditDialog(options = {}) {
|
|
|
400
415
|
error.element.id = ids.error;
|
|
401
416
|
if (ids?.cancel)
|
|
402
417
|
cancel.element.id = ids.cancel;
|
|
403
|
-
const generation = new Generation();
|
|
404
418
|
const life = new Lifetime();
|
|
405
419
|
let pending = false;
|
|
406
420
|
let state = { title: options.title ?? 'Edit message', ...options };
|
|
407
|
-
const dialog = createDialog({ ...state, dialog: options.dialog, content: form, onClose() {
|
|
421
|
+
const dialog = createDialog({ ...state, dialog: options.dialog, content: form, onClose() { operation.invalidate(); options.onClose?.(); } });
|
|
408
422
|
if (ids?.title) {
|
|
409
423
|
dialog.element.querySelector('h2').id = ids.title;
|
|
410
424
|
dialog.element.setAttribute('aria-labelledby', ids.title);
|
|
@@ -414,82 +428,50 @@ export function createTextEditDialog(options = {}) {
|
|
|
414
428
|
dialog.update(next);
|
|
415
429
|
setText(note, next.note);
|
|
416
430
|
note.hidden = !next.note;
|
|
431
|
+
cancel.update({ label: 'Cancel', disabled: !!next.closeDisabled });
|
|
417
432
|
error.update({ message: next.error ?? '', tone: 'error' });
|
|
418
433
|
submit.update({ label: next.submitLabel ?? options.submitLabel ?? 'Save', intent: 'primary', disabled: next.disabled, pending: !!(next.pending || pending) });
|
|
419
434
|
input.update({ disabled: !!next.inputDisabled });
|
|
420
435
|
};
|
|
436
|
+
const operation = createOperation({
|
|
437
|
+
unavailable: () => !!(state.pending || state.disabled || submit.element.disabled || !dialog.element.open),
|
|
438
|
+
onPending(value) { pending = value; update(state); },
|
|
439
|
+
onError(error) { if (dialog.element.open)
|
|
440
|
+
update({ ...state, error }); },
|
|
441
|
+
});
|
|
421
442
|
life.listen(form, 'submit', (event => {
|
|
422
443
|
event.preventDefault();
|
|
423
|
-
if (
|
|
444
|
+
if (!options.onSubmit)
|
|
424
445
|
return;
|
|
425
|
-
const seq = generation.next();
|
|
426
446
|
const value = control.value;
|
|
427
|
-
|
|
428
|
-
update(state);
|
|
429
|
-
void Promise.resolve().then(() => options.onSubmit(value)).then(result => {
|
|
430
|
-
if (!generation.current(seq) || !dialog.element.open)
|
|
431
|
-
return;
|
|
447
|
+
operation.run(() => options.onSubmit(value), result => { if (dialog.element.open) {
|
|
432
448
|
if (result.ok)
|
|
433
449
|
dialog.close();
|
|
434
|
-
else
|
|
435
|
-
|
|
436
|
-
}
|
|
437
|
-
}).catch((reason) => {
|
|
438
|
-
if (generation.current(seq))
|
|
439
|
-
state = { ...state, error: reason instanceof Error ? reason.message : String(reason) };
|
|
440
|
-
}).finally(() => { if (generation.current(seq)) {
|
|
441
|
-
pending = false;
|
|
442
|
-
update(state);
|
|
450
|
+
else
|
|
451
|
+
update({ ...state, error: result.error });
|
|
443
452
|
} });
|
|
444
453
|
}));
|
|
445
454
|
update(state);
|
|
446
455
|
return { element: dialog.element, control, submitButton: submit.element, update,
|
|
447
456
|
open(target) {
|
|
448
|
-
|
|
449
|
-
pending = false;
|
|
457
|
+
operation.invalidate();
|
|
450
458
|
update({ ...state, error: '', title: target.title ?? options.title ?? 'Edit message', description: target.description ?? options.description, note: target.note ?? options.note });
|
|
451
459
|
input.reset(target.value);
|
|
452
460
|
dialog.open();
|
|
453
461
|
input.focus();
|
|
454
|
-
}, close() {
|
|
455
|
-
destroy() {
|
|
462
|
+
}, close() { operation.invalidate(); dialog.close(); }, getValue: input.getValue, focus: input.focus,
|
|
463
|
+
destroy() { operation.destroy(); life.destroy(); input.destroy(); dialog.destroy(); cancel.destroy(); submit.destroy(); } };
|
|
456
464
|
}
|
|
457
465
|
export function createConfirmDialog(options) {
|
|
458
466
|
const message = element('p', 'pui-modal-description');
|
|
459
467
|
const hint = element('p', 'pui-field-hint');
|
|
460
468
|
const error = createNotice({ message: '', tone: 'error' });
|
|
461
|
-
const generation = new Generation();
|
|
462
469
|
let state = options;
|
|
463
470
|
let pending = false;
|
|
464
|
-
const cancel = createButton({ label: 'Cancel', onAction() {
|
|
471
|
+
const cancel = createButton({ label: 'Cancel', onAction() { if (!state.closeDisabled)
|
|
472
|
+
dialog.close(); } });
|
|
465
473
|
const confirm = createButton({ label: options.confirmLabel ?? 'Remove', intent: 'danger', type: 'submit' });
|
|
466
474
|
const life = new Lifetime();
|
|
467
|
-
const run = async () => {
|
|
468
|
-
if (pending || state.disabled || state.pending || confirm.element.disabled || options.unavailable?.())
|
|
469
|
-
return;
|
|
470
|
-
const seq = generation.next();
|
|
471
|
-
pending = true;
|
|
472
|
-
update(state);
|
|
473
|
-
try {
|
|
474
|
-
const result = await options.onConfirm();
|
|
475
|
-
if (!generation.current(seq) || !dialog.element.open)
|
|
476
|
-
return;
|
|
477
|
-
if (result.ok)
|
|
478
|
-
dialog.close();
|
|
479
|
-
else
|
|
480
|
-
state = { ...state, error: result.error };
|
|
481
|
-
}
|
|
482
|
-
catch (reason) {
|
|
483
|
-
if (generation.current(seq))
|
|
484
|
-
state = { ...state, error: reason instanceof Error ? reason.message : String(reason) };
|
|
485
|
-
}
|
|
486
|
-
finally {
|
|
487
|
-
if (generation.current(seq)) {
|
|
488
|
-
pending = false;
|
|
489
|
-
update(state);
|
|
490
|
-
}
|
|
491
|
-
}
|
|
492
|
-
};
|
|
493
475
|
const actions = createActions({ children: [cancel.element, confirm.element] });
|
|
494
476
|
const form = element('form', 'pui-confirm', message, hint, error.element, actions.element);
|
|
495
477
|
if (options.ids?.form)
|
|
@@ -499,7 +481,7 @@ export function createConfirmDialog(options) {
|
|
|
499
481
|
if (options.ids?.cancel)
|
|
500
482
|
cancel.element.id = options.ids.cancel;
|
|
501
483
|
const dialog = createDialog({ ...options, content: form,
|
|
502
|
-
onClose() {
|
|
484
|
+
onClose() { operation.invalidate(); options.onClose?.(); } });
|
|
503
485
|
if (options.ids?.title) {
|
|
504
486
|
dialog.element.querySelector('h2').id = options.ids.title;
|
|
505
487
|
dialog.element.setAttribute('aria-labelledby', options.ids.title);
|
|
@@ -508,6 +490,7 @@ export function createConfirmDialog(options) {
|
|
|
508
490
|
const update = (next) => {
|
|
509
491
|
state = next;
|
|
510
492
|
dialog.update(next);
|
|
493
|
+
cancel.update({ label: 'Cancel', disabled: !!next.closeDisabled });
|
|
511
494
|
if (next.message !== currentMessage) {
|
|
512
495
|
currentMessage = next.message;
|
|
513
496
|
if (next.message instanceof Node)
|
|
@@ -520,18 +503,28 @@ export function createConfirmDialog(options) {
|
|
|
520
503
|
error.update({ message: next.error ?? '', tone: 'error' });
|
|
521
504
|
confirm.update({ label: next.confirmLabel ?? 'Remove', intent: 'danger', disabled: !!(next.disabled || options.unavailable?.()), pending: !!(next.pending || pending) });
|
|
522
505
|
};
|
|
523
|
-
|
|
506
|
+
const operation = createOperation({
|
|
507
|
+
unavailable: () => !!(state.disabled || state.pending || confirm.element.disabled || options.unavailable?.() || !dialog.element.open),
|
|
508
|
+
onPending(value) { pending = value; update(state); },
|
|
509
|
+
onError(error) { if (dialog.element.open)
|
|
510
|
+
update({ ...state, error }); },
|
|
511
|
+
});
|
|
512
|
+
life.listen(form, 'submit', (event => { event.preventDefault(); operation.run(options.onConfirm, result => { if (dialog.element.open) {
|
|
513
|
+
if (result.ok)
|
|
514
|
+
dialog.close();
|
|
515
|
+
else
|
|
516
|
+
update({ ...state, error: result.error });
|
|
517
|
+
} }); }));
|
|
524
518
|
update(options);
|
|
525
|
-
return { element: dialog.element, confirmButton: confirm.element, cancelButton: cancel.element, update, open(next) {
|
|
526
|
-
close() {
|
|
519
|
+
return { element: dialog.element, confirmButton: confirm.element, cancelButton: cancel.element, update, open(next) { operation.invalidate(); update({ ...(next ?? state), error: '' }); dialog.open(); cancel.element.focus(); },
|
|
520
|
+
close() { operation.invalidate(); dialog.close(); }, refreshAvailability() { update(state); }, destroy() { operation.destroy(); life.destroy(); dialog.destroy(); confirm.destroy(); cancel.destroy(); } };
|
|
527
521
|
}
|
|
528
522
|
export function createPopover(options) {
|
|
529
|
-
let open = false;
|
|
530
523
|
let state = options;
|
|
531
|
-
const trigger = createButton({ label: options.label, onAction() { if (
|
|
532
|
-
close();
|
|
524
|
+
const trigger = createButton({ label: options.label, onAction() { if (surface.isOpen())
|
|
525
|
+
surface.close();
|
|
533
526
|
else
|
|
534
|
-
|
|
527
|
+
surface.open(); } });
|
|
535
528
|
const panel = element('div', 'pui-popover-panel', options.content);
|
|
536
529
|
panel.hidden = true;
|
|
537
530
|
panel.id = uniqueId('pui-popover');
|
|
@@ -540,80 +533,58 @@ export function createPopover(options) {
|
|
|
540
533
|
trigger.element.setAttribute('aria-controls', panel.id);
|
|
541
534
|
trigger.element.setAttribute('aria-expanded', 'false');
|
|
542
535
|
const root = element('div', 'pui-popover', trigger.element, panel);
|
|
543
|
-
const
|
|
544
|
-
function close(restoreFocus = false) {
|
|
545
|
-
if (!open)
|
|
546
|
-
return;
|
|
547
|
-
open = false;
|
|
548
|
-
panel.hidden = true;
|
|
549
|
-
trigger.element.setAttribute('aria-expanded', 'false');
|
|
550
|
-
options.onToggle?.(false);
|
|
551
|
-
if (restoreFocus && trigger.element.isConnected)
|
|
552
|
-
trigger.element.focus();
|
|
553
|
-
}
|
|
554
|
-
function show() {
|
|
555
|
-
if (state.disabled || open)
|
|
556
|
-
return;
|
|
557
|
-
open = true;
|
|
558
|
-
panel.hidden = false;
|
|
559
|
-
trigger.element.setAttribute('aria-expanded', 'true');
|
|
560
|
-
options.onToggle?.(true);
|
|
561
|
-
}
|
|
562
|
-
life.listen(document, 'pointerdown', (event => { if (open && event.target instanceof Node && !root.contains(event.target))
|
|
563
|
-
close(); }));
|
|
564
|
-
life.listen(root, 'keydown', (event => { if (open && event.key === 'Escape') {
|
|
565
|
-
event.preventDefault();
|
|
566
|
-
event.stopPropagation();
|
|
567
|
-
close(true);
|
|
568
|
-
} }));
|
|
569
|
-
life.listen(root, 'focusout', (() => { queueMicrotask(() => { if (open && !root.contains(document.activeElement))
|
|
570
|
-
close(); }); }));
|
|
536
|
+
const surface = installAnchoredSurface({ trigger: trigger.element, panel, canOpen: () => !state.disabled, onToggle: options.onToggle });
|
|
571
537
|
const update = (next) => { state = next; trigger.update(next); panel.setAttribute('aria-label', next.label); if (next.disabled)
|
|
572
|
-
close(); };
|
|
538
|
+
surface.close(); };
|
|
573
539
|
update(options);
|
|
574
|
-
return { element: root, trigger: trigger.element, panel, update, open:
|
|
575
|
-
destroy() {
|
|
540
|
+
return { element: root, trigger: trigger.element, panel, update, open: surface.open, close: surface.close, isOpen: surface.isOpen,
|
|
541
|
+
destroy() { surface.destroy(); trigger.destroy(); } };
|
|
576
542
|
}
|
|
577
543
|
export function createMenu(options) {
|
|
578
544
|
const content = element('div', 'pui-menu');
|
|
579
545
|
content.setAttribute('role', 'menu');
|
|
546
|
+
content.tabIndex = -1;
|
|
580
547
|
const blocks = new Map();
|
|
581
548
|
let items = options.items;
|
|
582
|
-
const
|
|
549
|
+
const session = new Generation();
|
|
550
|
+
const feedback = createNotice({ message: '', tone: 'error' });
|
|
551
|
+
const menuBody = element('div', '', content, feedback.element);
|
|
552
|
+
const popover = createPopover({ label: options.label, content: menuBody, disabled: options.disabled, onToggle() { session.invalidate(); feedback.update({ message: '', tone: 'error' }); } });
|
|
583
553
|
popover.trigger.setAttribute('aria-haspopup', 'menu');
|
|
584
554
|
const life = new Lifetime();
|
|
585
555
|
const update = (state) => {
|
|
586
556
|
items = state.items;
|
|
587
557
|
popover.update(state);
|
|
588
|
-
|
|
589
|
-
|
|
590
|
-
|
|
591
|
-
|
|
592
|
-
block.element.remove();
|
|
593
|
-
blocks.delete(id);
|
|
594
|
-
}
|
|
595
|
-
for (const item of state.items) {
|
|
596
|
-
let block = blocks.get(item.id);
|
|
597
|
-
if (!block) {
|
|
598
|
-
block = createButton({ ...item, onAction: async () => {
|
|
558
|
+
reconcileKeyed(content, blocks, state.items, { key: item => item.id, element: block => block.element,
|
|
559
|
+
create(item) {
|
|
560
|
+
let sequence = 0;
|
|
561
|
+
return createButton({ ...item, onAction: async () => {
|
|
599
562
|
const current = items.find(candidate => candidate.id === item.id);
|
|
600
|
-
if (!current || current.disabled)
|
|
563
|
+
if (!current || current.disabled || !popover.isOpen())
|
|
601
564
|
return;
|
|
565
|
+
// Pending disables the action button. Keep focus inside its menu so
|
|
566
|
+
// focus-out dismissal cannot discard the eventual result feedback.
|
|
567
|
+
content.focus({ preventScroll: true });
|
|
568
|
+
sequence = session.next();
|
|
569
|
+
feedback.update({ message: '', tone: 'error' });
|
|
602
570
|
const result = await current.onAction();
|
|
603
|
-
if (!result || result.ok)
|
|
571
|
+
if (session.current(sequence) && blocks.has(item.id) && popover.isOpen() && (!result || result.ok))
|
|
604
572
|
popover.close();
|
|
605
573
|
return result;
|
|
606
|
-
}
|
|
607
|
-
|
|
608
|
-
|
|
609
|
-
|
|
610
|
-
|
|
611
|
-
|
|
612
|
-
block.
|
|
613
|
-
|
|
614
|
-
|
|
615
|
-
|
|
616
|
-
|
|
574
|
+
}, onError(message) { if (session.current(sequence) && popover.isOpen()) {
|
|
575
|
+
feedback.update({ message, tone: 'error' });
|
|
576
|
+
options.onError?.(message);
|
|
577
|
+
} } });
|
|
578
|
+
},
|
|
579
|
+
update(block, item) {
|
|
580
|
+
block.update(item);
|
|
581
|
+
block.element.setAttribute('role', item.checked == null ? 'menuitem' : 'menuitemcheckbox');
|
|
582
|
+
if (item.checked != null)
|
|
583
|
+
block.element.setAttribute('aria-checked', String(item.checked));
|
|
584
|
+
else
|
|
585
|
+
block.element.removeAttribute('aria-checked');
|
|
586
|
+
}, destroy: block => block.destroy(),
|
|
587
|
+
});
|
|
617
588
|
};
|
|
618
589
|
life.listen(popover.trigger, 'keydown', (event => {
|
|
619
590
|
const key = event.key;
|
|
@@ -627,7 +598,7 @@ export function createMenu(options) {
|
|
|
627
598
|
onDismiss(restoreFocus) { popover.close(); if (restoreFocus)
|
|
628
599
|
popover.trigger.focus(); } });
|
|
629
600
|
update(options);
|
|
630
|
-
return { ...popover, update, destroy() { navigation.destroy(); life.destroy(); popover.destroy(); for (const block of blocks.values())
|
|
631
|
-
block.destroy(); } };
|
|
601
|
+
return { ...popover, update, destroy() { session.destroy(); navigation.destroy(); life.destroy(); popover.destroy(); feedback.destroy(); for (const block of blocks.values())
|
|
602
|
+
block.destroy(); blocks.clear(); } };
|
|
632
603
|
}
|
|
633
604
|
//# sourceMappingURL=primitives.js.map
|