@api-client/ui 0.5.20 → 0.5.21

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.
@@ -1,6 +1,7 @@
1
- import { type CSSResultOrNative, type PropertyValues, type TemplateResult } from 'lit';
1
+ import { type PropertyValues, type TemplateResult } from 'lit';
2
2
  import { UiElement } from '../../UiElement.js';
3
3
  import type { TypedEvents } from '../../../core/types.js';
4
+ import type { ButtonType } from '../../button/internals/button.js';
4
5
  import '../../button/ui-button.js';
5
6
  export interface UiDialogClosingReason {
6
7
  /**
@@ -31,8 +32,8 @@ export type RenderFunction = () => TemplateResult;
31
32
  * closing reason detail.
32
33
  *
33
34
  * ```javascript
34
- * <ui-button color="text" value="dismiss">Cancel</ui-button>
35
- * <ui-button color="text" value="confirm">Take action</ui-button>
35
+ * <ui-button slot="button" color="text" value="dismiss">Cancel</ui-button>
36
+ * <ui-button slot="button" color="text" value="confirm">Take action</ui-button>
36
37
  * ```
37
38
  *
38
39
  * ```javascript
@@ -109,25 +110,6 @@ export default class UiDialog extends UiElement implements TypedEvents<DialogEve
109
110
  * @attribute
110
111
  */
111
112
  accessor destructive: boolean;
112
- /**
113
- * Part of the imperative access to the element.
114
- * When set, it wraps the content in a `<form>` element.
115
- * When this is enabled the following will happen:
116
- * - The `confirm` button will get `type="submit"`
117
- * - The form `method` attribute is set to `dialog`
118
- * - The form `id` attribute is set to a random string. You can get it from the `formId` getter.
119
- * - The dialog will dispatch the same `submit` event as the form.
120
- * - When the `submit` event dispatched by the dialog gets cancelled, then:
121
- * - The original submit event also gets cancelled.
122
- * - The default confirm action is not invoked
123
- * - The dialog stays opened
124
- * - When the submit event is not cancelled, then:
125
- * - The default confirm action is invoked.
126
- * - The dialog is closed.
127
- *
128
- * @deprecated Wrap the content in a `<form>` element instead.
129
- */
130
- accessor useForm: boolean | undefined;
131
113
  /**
132
114
  * Only when `confirmLabel` is set.
133
115
  * Defines the value associated with the button's name when it's submitted with the form data.
@@ -135,6 +117,14 @@ export default class UiDialog extends UiElement implements TypedEvents<DialogEve
135
117
  * @attribute
136
118
  */
137
119
  accessor confirmValue: string | undefined;
120
+ /**
121
+ * The type of the confirm button.
122
+ * This is used to set the button's `type` attribute.
123
+ * If not set, the default is `button`.
124
+ * If set to `submit`, the dialog will trigger the form submission on the parent form.
125
+ * @attribute
126
+ */
127
+ accessor confirmType: ButtonType | undefined;
138
128
  /**
139
129
  * When the dialog is wrapped in a form, set this to `true` to close the dialog
140
130
  * when the form is submitted.
@@ -142,6 +132,7 @@ export default class UiDialog extends UiElement implements TypedEvents<DialogEve
142
132
  * Note that the dialog doesn't perform any validation of the form. It only closes
143
133
  * when the form is submitted, regardless of the application logic. The `submit` event
144
134
  * is dispatched by the dialog when the form is valid.
135
+ * @attribute
145
136
  */
146
137
  accessor submitClose: boolean | undefined;
147
138
  /**
@@ -159,22 +150,9 @@ export default class UiDialog extends UiElement implements TypedEvents<DialogEve
159
150
  * This is passed to the close event.
160
151
  */
161
152
  dialogValue?: unknown;
162
- /**
163
- * @deprecated Use `useForm` instead.
164
- */
165
- get formId(): string | undefined;
166
153
  constructor();
167
- /**
168
- * Allows to inject a template into the internals of the element.
169
- * This is helpful when working with imperative dialogs.
170
- * @param content The content to inject into the body.
171
- * @deprecated This will be removed in the future. To use forms, wrap the content in a `<form>` element.
172
- */
173
- inject(content?: TemplateResult | RenderFunction, styles?: CSSResultOrNative[]): void;
174
154
  connectedCallback(): void;
175
155
  disconnectedCallback(): void;
176
- protected firstUpdated(): void;
177
- willUpdate(cp: PropertyValues<this>): void;
178
156
  protected handleFormSubmit(): void;
179
157
  handleClick(e: MouseEvent): void;
180
158
  handleKeyDown(e: KeyboardEvent): void;
@@ -1 +1 @@
1
- {"version":3,"file":"Dialog.d.ts","sourceRoot":"","sources":["../../../../../src/md/dialog/internals/Dialog.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"Dialog.d.ts","sourceRoot":"","sources":["../../../../../src/md/dialog/internals/Dialog.ts"],"names":[],"mappings":"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"}
@@ -1,11 +1,9 @@
1
- import { __esDecorate, __runInitializers, __setFunctionName } from "tslib";
2
- import { html, nothing, adoptStyles } from 'lit';
1
+ import { __esDecorate, __runInitializers } from "tslib";
2
+ import { html, nothing } from 'lit';
3
3
  import { property, query, queryAssignedElements, queryAssignedNodes, state } from 'lit/decorators.js';
4
4
  import { classMap } from 'lit/directives/class-map.js';
5
5
  import { UiElement } from '../../UiElement.js';
6
6
  import { isDisabled, setDisabled } from '../../../lib/disabled.js';
7
- import { ifDefined } from 'lit/directives/if-defined.js';
8
- import { SyntheticSubmitEvent } from '../../../events/SyntheticSubmitEvent.js';
9
7
  import '../../button/ui-button.js';
10
8
  import { bound } from '../../../decorators/bound.js';
11
9
  let UiDialog = (() => {
@@ -27,12 +25,12 @@ let UiDialog = (() => {
27
25
  let _destructive_decorators;
28
26
  let _destructive_initializers = [];
29
27
  let _destructive_extraInitializers = [];
30
- let _useForm_decorators;
31
- let _useForm_initializers = [];
32
- let _useForm_extraInitializers = [];
33
28
  let _confirmValue_decorators;
34
29
  let _confirmValue_initializers = [];
35
30
  let _confirmValue_extraInitializers = [];
31
+ let _confirmType_decorators;
32
+ let _confirmType_initializers = [];
33
+ let _confirmType_extraInitializers = [];
36
34
  let _submitClose_decorators;
37
35
  let _submitClose_initializers = [];
38
36
  let _submitClose_extraInitializers = [];
@@ -57,10 +55,6 @@ let UiDialog = (() => {
57
55
  let _buttons_decorators;
58
56
  let _buttons_initializers = [];
59
57
  let _buttons_extraInitializers = [];
60
- let _private_inject_decorators;
61
- let _private_inject_initializers = [];
62
- let _private_inject_extraInitializers = [];
63
- let _private_inject_descriptor;
64
58
  let _handleFormSubmit_decorators;
65
59
  return class UiDialog extends _classSuper {
66
60
  static {
@@ -71,8 +65,8 @@ let UiDialog = (() => {
71
65
  _dismissLabel_decorators = [property({ type: String })];
72
66
  _confirmLabel_decorators = [property({ type: String })];
73
67
  _destructive_decorators = [property({ type: Boolean })];
74
- _useForm_decorators = [property({ type: Boolean })];
75
68
  _confirmValue_decorators = [property({ type: String })];
69
+ _confirmType_decorators = [property({ type: String })];
76
70
  _submitClose_decorators = [property({ type: Boolean })];
77
71
  _dialog_decorators = [query('dialog')];
78
72
  _hasIcon_decorators = [state()];
@@ -81,7 +75,6 @@ let UiDialog = (() => {
81
75
  _icons_decorators = [queryAssignedElements({ flatten: true, slot: 'icon' })];
82
76
  _titles_decorators = [queryAssignedNodes({ flatten: true, slot: 'title' })];
83
77
  _buttons_decorators = [queryAssignedElements({ flatten: true, slot: 'button' })];
84
- _private_inject_decorators = [state()];
85
78
  _handleFormSubmit_decorators = [bound];
86
79
  __esDecorate(this, null, _set_disabled_decorators, { kind: "setter", name: "disabled", static: false, private: false, access: { has: obj => "disabled" in obj, set: (obj, value) => { obj.disabled = value; } }, metadata: _metadata }, null, _instanceExtraInitializers);
87
80
  __esDecorate(this, null, _modal_decorators, { kind: "accessor", name: "modal", static: false, private: false, access: { has: obj => "modal" in obj, get: obj => obj.modal, set: (obj, value) => { obj.modal = value; } }, metadata: _metadata }, _modal_initializers, _modal_extraInitializers);
@@ -89,8 +82,8 @@ let UiDialog = (() => {
89
82
  __esDecorate(this, null, _dismissLabel_decorators, { kind: "accessor", name: "dismissLabel", static: false, private: false, access: { has: obj => "dismissLabel" in obj, get: obj => obj.dismissLabel, set: (obj, value) => { obj.dismissLabel = value; } }, metadata: _metadata }, _dismissLabel_initializers, _dismissLabel_extraInitializers);
90
83
  __esDecorate(this, null, _confirmLabel_decorators, { kind: "accessor", name: "confirmLabel", static: false, private: false, access: { has: obj => "confirmLabel" in obj, get: obj => obj.confirmLabel, set: (obj, value) => { obj.confirmLabel = value; } }, metadata: _metadata }, _confirmLabel_initializers, _confirmLabel_extraInitializers);
91
84
  __esDecorate(this, null, _destructive_decorators, { kind: "accessor", name: "destructive", static: false, private: false, access: { has: obj => "destructive" in obj, get: obj => obj.destructive, set: (obj, value) => { obj.destructive = value; } }, metadata: _metadata }, _destructive_initializers, _destructive_extraInitializers);
92
- __esDecorate(this, null, _useForm_decorators, { kind: "accessor", name: "useForm", static: false, private: false, access: { has: obj => "useForm" in obj, get: obj => obj.useForm, set: (obj, value) => { obj.useForm = value; } }, metadata: _metadata }, _useForm_initializers, _useForm_extraInitializers);
93
85
  __esDecorate(this, null, _confirmValue_decorators, { kind: "accessor", name: "confirmValue", static: false, private: false, access: { has: obj => "confirmValue" in obj, get: obj => obj.confirmValue, set: (obj, value) => { obj.confirmValue = value; } }, metadata: _metadata }, _confirmValue_initializers, _confirmValue_extraInitializers);
86
+ __esDecorate(this, null, _confirmType_decorators, { kind: "accessor", name: "confirmType", static: false, private: false, access: { has: obj => "confirmType" in obj, get: obj => obj.confirmType, set: (obj, value) => { obj.confirmType = value; } }, metadata: _metadata }, _confirmType_initializers, _confirmType_extraInitializers);
94
87
  __esDecorate(this, null, _submitClose_decorators, { kind: "accessor", name: "submitClose", static: false, private: false, access: { has: obj => "submitClose" in obj, get: obj => obj.submitClose, set: (obj, value) => { obj.submitClose = value; } }, metadata: _metadata }, _submitClose_initializers, _submitClose_extraInitializers);
95
88
  __esDecorate(this, null, _dialog_decorators, { kind: "accessor", name: "dialog", static: false, private: false, access: { has: obj => "dialog" in obj, get: obj => obj.dialog, set: (obj, value) => { obj.dialog = value; } }, metadata: _metadata }, _dialog_initializers, _dialog_extraInitializers);
96
89
  __esDecorate(this, null, _hasIcon_decorators, { kind: "accessor", name: "hasIcon", static: false, private: false, access: { has: obj => "hasIcon" in obj, get: obj => obj.hasIcon, set: (obj, value) => { obj.hasIcon = value; } }, metadata: _metadata }, _hasIcon_initializers, _hasIcon_extraInitializers);
@@ -99,7 +92,6 @@ let UiDialog = (() => {
99
92
  __esDecorate(this, null, _icons_decorators, { kind: "accessor", name: "icons", static: false, private: false, access: { has: obj => "icons" in obj, get: obj => obj.icons, set: (obj, value) => { obj.icons = value; } }, metadata: _metadata }, _icons_initializers, _icons_extraInitializers);
100
93
  __esDecorate(this, null, _titles_decorators, { kind: "accessor", name: "titles", static: false, private: false, access: { has: obj => "titles" in obj, get: obj => obj.titles, set: (obj, value) => { obj.titles = value; } }, metadata: _metadata }, _titles_initializers, _titles_extraInitializers);
101
94
  __esDecorate(this, null, _buttons_decorators, { kind: "accessor", name: "buttons", static: false, private: false, access: { has: obj => "buttons" in obj, get: obj => obj.buttons, set: (obj, value) => { obj.buttons = value; } }, metadata: _metadata }, _buttons_initializers, _buttons_extraInitializers);
102
- __esDecorate(this, _private_inject_descriptor = { get: __setFunctionName(function () { return this.#inject_accessor_storage; }, "#inject", "get"), set: __setFunctionName(function (value) { this.#inject_accessor_storage = value; }, "#inject", "set") }, _private_inject_decorators, { kind: "accessor", name: "#inject", static: false, private: true, access: { has: obj => #inject in obj, get: obj => obj.#inject, set: (obj, value) => { obj.#inject = value; } }, metadata: _metadata }, _private_inject_initializers, _private_inject_extraInitializers);
103
95
  __esDecorate(this, null, _handleFormSubmit_decorators, { kind: "method", name: "handleFormSubmit", static: false, private: false, access: { has: obj => "handleFormSubmit" in obj, get: obj => obj.handleFormSubmit }, metadata: _metadata }, null, _instanceExtraInitializers);
104
96
  if (_metadata) Object.defineProperty(this, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
105
97
  }
@@ -163,22 +155,10 @@ let UiDialog = (() => {
163
155
  set confirmLabel(value) { this.#confirmLabel_accessor_storage = value; }
164
156
  #destructive_accessor_storage = (__runInitializers(this, _confirmLabel_extraInitializers), __runInitializers(this, _destructive_initializers, false
165
157
  /**
166
- * Part of the imperative access to the element.
167
- * When set, it wraps the content in a `<form>` element.
168
- * When this is enabled the following will happen:
169
- * - The `confirm` button will get `type="submit"`
170
- * - The form `method` attribute is set to `dialog`
171
- * - The form `id` attribute is set to a random string. You can get it from the `formId` getter.
172
- * - The dialog will dispatch the same `submit` event as the form.
173
- * - When the `submit` event dispatched by the dialog gets cancelled, then:
174
- * - The original submit event also gets cancelled.
175
- * - The default confirm action is not invoked
176
- * - The dialog stays opened
177
- * - When the submit event is not cancelled, then:
178
- * - The default confirm action is invoked.
179
- * - The dialog is closed.
180
- *
181
- * @deprecated Wrap the content in a `<form>` element instead.
158
+ * Only when `confirmLabel` is set.
159
+ * Defines the value associated with the button's name when it's submitted with the form data.
160
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#value}
161
+ * @attribute
182
162
  */
183
163
  ));
184
164
  /**
@@ -188,28 +168,7 @@ let UiDialog = (() => {
188
168
  */
189
169
  get destructive() { return this.#destructive_accessor_storage; }
190
170
  set destructive(value) { this.#destructive_accessor_storage = value; }
191
- #useForm_accessor_storage = (__runInitializers(this, _destructive_extraInitializers), __runInitializers(this, _useForm_initializers, void 0));
192
- /**
193
- * Part of the imperative access to the element.
194
- * When set, it wraps the content in a `<form>` element.
195
- * When this is enabled the following will happen:
196
- * - The `confirm` button will get `type="submit"`
197
- * - The form `method` attribute is set to `dialog`
198
- * - The form `id` attribute is set to a random string. You can get it from the `formId` getter.
199
- * - The dialog will dispatch the same `submit` event as the form.
200
- * - When the `submit` event dispatched by the dialog gets cancelled, then:
201
- * - The original submit event also gets cancelled.
202
- * - The default confirm action is not invoked
203
- * - The dialog stays opened
204
- * - When the submit event is not cancelled, then:
205
- * - The default confirm action is invoked.
206
- * - The dialog is closed.
207
- *
208
- * @deprecated Wrap the content in a `<form>` element instead.
209
- */
210
- get useForm() { return this.#useForm_accessor_storage; }
211
- set useForm(value) { this.#useForm_accessor_storage = value; }
212
- #confirmValue_accessor_storage = (__runInitializers(this, _useForm_extraInitializers), __runInitializers(this, _confirmValue_initializers, void 0));
171
+ #confirmValue_accessor_storage = (__runInitializers(this, _destructive_extraInitializers), __runInitializers(this, _confirmValue_initializers, void 0));
213
172
  /**
214
173
  * Only when `confirmLabel` is set.
215
174
  * Defines the value associated with the button's name when it's submitted with the form data.
@@ -218,7 +177,17 @@ let UiDialog = (() => {
218
177
  */
219
178
  get confirmValue() { return this.#confirmValue_accessor_storage; }
220
179
  set confirmValue(value) { this.#confirmValue_accessor_storage = value; }
221
- #submitClose_accessor_storage = (__runInitializers(this, _confirmValue_extraInitializers), __runInitializers(this, _submitClose_initializers, void 0));
180
+ #confirmType_accessor_storage = (__runInitializers(this, _confirmValue_extraInitializers), __runInitializers(this, _confirmType_initializers, void 0));
181
+ /**
182
+ * The type of the confirm button.
183
+ * This is used to set the button's `type` attribute.
184
+ * If not set, the default is `button`.
185
+ * If set to `submit`, the dialog will trigger the form submission on the parent form.
186
+ * @attribute
187
+ */
188
+ get confirmType() { return this.#confirmType_accessor_storage; }
189
+ set confirmType(value) { this.#confirmType_accessor_storage = value; }
190
+ #submitClose_accessor_storage = (__runInitializers(this, _confirmType_extraInitializers), __runInitializers(this, _submitClose_initializers, void 0));
222
191
  /**
223
192
  * When the dialog is wrapped in a form, set this to `true` to close the dialog
224
193
  * when the form is submitted.
@@ -226,6 +195,7 @@ let UiDialog = (() => {
226
195
  * Note that the dialog doesn't perform any validation of the form. It only closes
227
196
  * when the form is submitted, regardless of the application logic. The `submit` event
228
197
  * is dispatched by the dialog when the form is valid.
198
+ * @attribute
229
199
  */
230
200
  get submitClose() { return this.#submitClose_accessor_storage; }
231
201
  set submitClose(value) { this.#submitClose_accessor_storage = value; }
@@ -258,23 +228,6 @@ let UiDialog = (() => {
258
228
  * This is passed to the close event.
259
229
  */
260
230
  dialogValue = __runInitializers(this, _buttons_extraInitializers);
261
- #formId;
262
- /**
263
- * @deprecated Use `useForm` instead.
264
- */
265
- get formId() {
266
- return this.#formId;
267
- }
268
- #inject_accessor_storage = __runInitializers(this, _private_inject_initializers, void 0);
269
- /**
270
- * @deprecated This will be removed in the future.
271
- */
272
- get #inject() { return _private_inject_descriptor.get.call(this); }
273
- set #inject(value) { return _private_inject_descriptor.set.call(this, value); }
274
- /**
275
- * @deprecated This will be removed in the future.
276
- */
277
- #pendingStyles = __runInitializers(this, _private_inject_extraInitializers);
278
231
  /**
279
232
  * A reference to the parent form element.
280
233
  * When a form is found, the dialog will hook into the form's submit event
@@ -288,29 +241,6 @@ let UiDialog = (() => {
288
241
  this.addEventListener('click', this.handleClick);
289
242
  this.addEventListener('keydown', this.handleKeyDown);
290
243
  }
291
- /**
292
- * Allows to inject a template into the internals of the element.
293
- * This is helpful when working with imperative dialogs.
294
- * @param content The content to inject into the body.
295
- * @deprecated This will be removed in the future. To use forms, wrap the content in a `<form>` element.
296
- */
297
- inject(content, styles) {
298
- this.#inject = content;
299
- if (styles) {
300
- if (this.shadowRoot) {
301
- adoptStyles(this.shadowRoot, styles);
302
- }
303
- else {
304
- if (!this.#pendingStyles) {
305
- this.#pendingStyles = [];
306
- }
307
- this.#pendingStyles.push(...styles);
308
- }
309
- }
310
- if (this.shadowRoot && styles) {
311
- adoptStyles(this.shadowRoot, styles);
312
- }
313
- }
314
244
  connectedCallback() {
315
245
  super.connectedCallback();
316
246
  this.#form = this.closest('form');
@@ -325,20 +255,6 @@ let UiDialog = (() => {
325
255
  this.#form = null;
326
256
  }
327
257
  }
328
- firstUpdated() {
329
- const styles = this.#pendingStyles;
330
- if (styles) {
331
- const root = this.shadowRoot;
332
- const all = [...root.adoptedStyleSheets, ...styles];
333
- adoptStyles(this.shadowRoot, all);
334
- }
335
- }
336
- willUpdate(cp) {
337
- if (cp.has('useForm') && this.useForm && !this.#formId) {
338
- const r = (Math.random() + 1).toString(36).substring(7);
339
- this.#formId = `form-${r}`;
340
- }
341
- }
342
258
  handleFormSubmit() {
343
259
  if (this.submitClose) {
344
260
  this.handleInteraction('confirm');
@@ -461,45 +377,20 @@ let UiDialog = (() => {
461
377
  this.handleInteraction('dismiss');
462
378
  }
463
379
  handleConfirm() {
464
- if (!this.useForm) {
465
- this.handleInteraction('confirm');
466
- }
467
- }
468
- #handleSubmit(event) {
469
- const form = event.target;
470
- const copy = new SyntheticSubmitEvent(event.type, form, {
471
- submitter: event.submitter,
472
- cancelable: true,
473
- bubbles: false,
474
- composed: false,
475
- });
476
- const dispatched = this.dispatchEvent(copy);
477
- if (dispatched) {
478
- this.handleInteraction('confirm');
479
- }
480
- else {
481
- event.preventDefault();
482
- }
380
+ this.handleInteraction('confirm');
483
381
  }
484
382
  render() {
485
- const { useForm, modal } = this;
383
+ const { modal } = this;
486
384
  const dialogClass = modal ? 'modal' : 'non-modal';
487
385
  return html `
488
386
  <dialog @close="${this.handleDialogClose}" part="dialog" class="${dialogClass}">
489
- <div class="container">${useForm ? this.#renderFormContent() : this.renderContent()}</div>
387
+ <div class="container">${this.renderContent()}</div>
490
388
  </dialog>
491
389
  `;
492
390
  }
493
391
  renderContent() {
494
392
  return [this.renderIcon(), this.renderTitle(), this.renderBody(), this.renderButtons()];
495
393
  }
496
- #renderFormContent() {
497
- return html `
498
- <form id="${ifDefined(this.formId)}" method="dialog" @submit="${this.#handleSubmit}" part="form">
499
- ${this.renderContent()}
500
- </form>
501
- `;
502
- }
503
394
  renderIcon() {
504
395
  const classes = {
505
396
  'icon': true,
@@ -524,12 +415,7 @@ let UiDialog = (() => {
524
415
  `;
525
416
  }
526
417
  renderBody() {
527
- let content = this.#inject;
528
- if (typeof content === 'function') {
529
- content = content();
530
- }
531
- const injected = content || nothing;
532
- return html ` <div class="content" part="body"><slot></slot>${injected}</div> `;
418
+ return html ` <div class="content" part="body"><slot></slot></div> `;
533
419
  }
534
420
  renderButtons() {
535
421
  const classes = {
@@ -560,11 +446,11 @@ let UiDialog = (() => {
560
446
  `;
561
447
  }
562
448
  #renderConfirmButton() {
563
- const { confirmLabel, confirmValue = 'confirm', useForm, destructive } = this;
449
+ const { confirmLabel, confirmValue = 'confirm', destructive } = this;
564
450
  if (!confirmLabel) {
565
451
  return nothing;
566
452
  }
567
- const type = useForm ? 'submit' : 'button';
453
+ const type = this.confirmType ?? 'button';
568
454
  const buttonClass = destructive ? 'internal-button destructive' : 'internal-button';
569
455
  return html `
570
456
  <ui-button
@@ -592,8 +478,8 @@ let UiDialog = (() => {
592
478
  * closing reason detail.
593
479
  *
594
480
  * ```javascript
595
- * <ui-button color="text" value="dismiss">Cancel</ui-button>
596
- * <ui-button color="text" value="confirm">Take action</ui-button>
481
+ * <ui-button slot="button" color="text" value="dismiss">Cancel</ui-button>
482
+ * <ui-button slot="button" color="text" value="confirm">Take action</ui-button>
597
483
  * ```
598
484
  *
599
485
  * ```javascript
@@ -1 +1 @@
1
- {"version":3,"file":"Dialog.js","sourceRoot":"","sources":["../../../../../src/md/dialog/internals/Dialog.ts"],"names":[],"mappings":"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","sourcesContent":["import { type CSSResultOrNative, html, nothing, type PropertyValues, type TemplateResult, adoptStyles } from 'lit'\nimport { property, query, queryAssignedElements, queryAssignedNodes, state } from 'lit/decorators.js'\nimport { type ClassInfo, classMap } from 'lit/directives/class-map.js'\nimport { UiElement } from '../../UiElement.js'\nimport { isDisabled, setDisabled } from '../../../lib/disabled.js'\nimport type UiButton from '../../button/internals/button.js'\nimport type { TypedEvents } from '../../../core/types.js'\nimport { ifDefined } from 'lit/directives/if-defined.js'\nimport { SyntheticSubmitEvent } from '../../../events/SyntheticSubmitEvent.js'\nimport '../../button/ui-button.js'\nimport { bound } from '../../../decorators/bound.js'\n\nexport interface UiDialogClosingReason {\n /**\n * Whether the dialog was cancelled by either activating the `dismiss` button\n * or by pressing escape.\n */\n cancelled: boolean\n /**\n * This is used in cases when the dialog has more complex purpose.\n * This is the value expected from the dialog.\n */\n value?: unknown\n}\n\ninterface DialogEventMap {\n closing: CustomEvent<UiDialogClosingReason>\n close: CustomEvent<UiDialogClosingReason>\n}\n\nexport type RenderFunction = () => TemplateResult\n\n/**\n * Styled dialog using a native `<dialog>` element under the hood.\n * Note, since native dialog renders in the top layer it is not necessary\n * to place the dialog in the `<body>`.\n *\n * **Using Buttons**\n *\n * The dialog automatically recognizes buttons with values `confirm` and `dismiss`\n * to close the dialog and dispatch the `close` event. The event has additional\n * closing reason detail.\n *\n * ```javascript\n * <ui-button color=\"text\" value=\"dismiss\">Cancel</ui-button>\n * <ui-button color=\"text\" value=\"confirm\">Take action</ui-button>\n * ```\n *\n * ```javascript\n * <button value=\"dismiss\">Cancel</button>\n * <button value=\"confirm\">Take action</button>\n * ```\n *\n * The detail object of the `close` event has the following properties:\n * - cancelled - Whether the dialog was cancelled by either activating the `dismiss` button or by pressing escape.\n *\n * The `close` event is only dispatched when the user interact with the dialog. Imperative control of the\n * dialog won't trigger the close button.\n *\n * ** Full example**\n *\n * ```javascript\n * <ui-dialog modal>\n * <ui-icon slot=\"icon\" icon=\"delete\"></ui-icon>\n *\n * <span slot=\"title\">Delete photos?</span>\n * <p>This action will permanently remove the selected pictures from your account.</p>\n *\n * <ui-button color=\"text\" slot=\"button\" value=\"dismiss\" type=\"text\">Cancel</ui-button>\n * <ui-button color=\"text\" slot=\"button\" value=\"confirm\" type=\"text\">Confirm</ui-button>\n * </ui-dialog>\n * ```\n *\n * @slot - The slot for the content of the dialog.\n * @slot icon - The slot to place the dialog icon\n * @slot title - The slot to place the dialog title. Do not put elements here, just the text.\n * @slot button - The slot to place the dialog buttons. Use the `confirm` or `dismiss`\n * buttons to automatically close the dialog.\n * @fires closing - A cancelable, non-bubbling event with the `UiDialogClosingReason` as the detail,\n * dispatched before the dialog closes. If prevented, the dialog will not close.\n * @fires close - A non-bubbling, non-cancellable event with the `UiDialogClosingReason` as the detail.\n */\nexport default class UiDialog extends UiElement implements TypedEvents<DialogEventMap> {\n get disabled(): boolean {\n return isDisabled(this)\n }\n\n /**\n * When set, the button is a disabled state.\n * @attribute\n */\n @property({ reflect: true, type: Boolean })\n set disabled(value: boolean) {\n const old = isDisabled(this)\n setDisabled(this, value)\n this.requestUpdate('disabled', old)\n }\n\n /**\n * Opens the dialog as modal when toggling dialog's open state.\n *\n * Setting this value after the dialog was opened has no effect.\n *\n * @attribute\n */\n @property({ type: Boolean }) accessor modal = false\n\n /**\n * Toggles visibility of the dialog.\n * Note, the dialog is opened asynchronously after the update is performed.\n * @attribute\n */\n @property({ type: Boolean }) accessor open = false\n\n /**\n * Imperative access to create a dismiss button.\n * When set this will render a dismiss button at the end of the buttons line, before the `confirmLabel` button.\n * @attribute\n */\n @property({ type: String }) accessor dismissLabel: string | undefined\n\n /**\n * Imperative access to create a confirm button.\n * When set this will render a confirm button at the end of the buttons line, after the `dismissLabel` button.\n * @attribute\n */\n @property({ type: String }) accessor confirmLabel: string | undefined\n\n /**\n * When true, styles the confirm button with error colors to indicate\n * a destructive action (e.g., delete, remove, etc.).\n * @attribute\n */\n @property({ type: Boolean }) accessor destructive = false\n\n /**\n * Part of the imperative access to the element.\n * When set, it wraps the content in a `<form>` element.\n * When this is enabled the following will happen:\n * - The `confirm` button will get `type=\"submit\"`\n * - The form `method` attribute is set to `dialog`\n * - The form `id` attribute is set to a random string. You can get it from the `formId` getter.\n * - The dialog will dispatch the same `submit` event as the form.\n * - When the `submit` event dispatched by the dialog gets cancelled, then:\n * - The original submit event also gets cancelled.\n * - The default confirm action is not invoked\n * - The dialog stays opened\n * - When the submit event is not cancelled, then:\n * - The default confirm action is invoked.\n * - The dialog is closed.\n *\n * @deprecated Wrap the content in a `<form>` element instead.\n */\n @property({ type: Boolean }) accessor useForm: boolean | undefined\n\n /**\n * Only when `confirmLabel` is set.\n * Defines the value associated with the button's name when it's submitted with the form data.\n * @see {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#value}\n * @attribute\n */\n @property({ type: String }) accessor confirmValue: string | undefined\n /**\n * When the dialog is wrapped in a form, set this to `true` to close the dialog\n * when the form is submitted.\n *\n * Note that the dialog doesn't perform any validation of the form. It only closes\n * when the form is submitted, regardless of the application logic. The `submit` event\n * is dispatched by the dialog when the form is valid.\n */\n @property({ type: Boolean }) accessor submitClose: boolean | undefined\n\n /**\n * A reference to the underlying dialog element.\n */\n @query('dialog') accessor dialog!: HTMLDialogElement\n\n @state() protected accessor hasIcon = false\n\n @state() protected accessor hasTitle = false\n\n @state() protected accessor hasButton = false\n\n @queryAssignedElements({ flatten: true, slot: 'icon' }) protected accessor icons!: HTMLElement[]\n\n @queryAssignedNodes({ flatten: true, slot: 'title' }) protected accessor titles!: HTMLElement[]\n\n @queryAssignedElements({ flatten: true, slot: 'button' }) protected accessor buttons!: HTMLElement[]\n\n /**\n * To be set by a child class when closing the dialog.\n * This is passed to the close event.\n */\n dialogValue?: unknown\n\n #formId?: string\n\n /**\n * @deprecated Use `useForm` instead.\n */\n get formId(): string | undefined {\n return this.#formId\n }\n\n /**\n * @deprecated This will be removed in the future.\n */\n @state() accessor #inject: TemplateResult | RenderFunction | undefined\n\n /**\n * @deprecated This will be removed in the future.\n */\n #pendingStyles?: CSSResultOrNative[]\n\n /**\n * A reference to the parent form element.\n * When a form is found, the dialog will hook into the form's submit event\n * and close the dialog when the form is submitted.\n * Since the `submit` event is dispatched when the form is valid,\n * we can use this to close the dialog and not worry about the form validation.\n */\n #form: HTMLFormElement | null = null\n\n constructor() {\n super()\n\n this.addEventListener('click', this.handleClick)\n this.addEventListener('keydown', this.handleKeyDown)\n }\n\n /**\n * Allows to inject a template into the internals of the element.\n * This is helpful when working with imperative dialogs.\n * @param content The content to inject into the body.\n * @deprecated This will be removed in the future. To use forms, wrap the content in a `<form>` element.\n */\n inject(content?: TemplateResult | RenderFunction, styles?: CSSResultOrNative[]): void {\n this.#inject = content\n if (styles) {\n if (this.shadowRoot) {\n adoptStyles(this.shadowRoot, styles)\n } else {\n if (!this.#pendingStyles) {\n this.#pendingStyles = []\n }\n this.#pendingStyles.push(...styles)\n }\n }\n if (this.shadowRoot && styles) {\n adoptStyles(this.shadowRoot, styles)\n }\n }\n\n override connectedCallback(): void {\n super.connectedCallback()\n this.#form = this.closest('form')\n if (this.#form) {\n this.#form.addEventListener('submit', this.handleFormSubmit)\n }\n }\n\n override disconnectedCallback(): void {\n super.disconnectedCallback()\n if (this.#form) {\n this.#form.removeEventListener('submit', this.handleFormSubmit)\n this.#form = null\n }\n }\n\n protected override firstUpdated(): void {\n const styles = this.#pendingStyles\n if (styles) {\n const root = this.shadowRoot as ShadowRoot\n const all = [...root.adoptedStyleSheets, ...styles]\n adoptStyles(this.shadowRoot as ShadowRoot, all)\n }\n }\n\n override willUpdate(cp: PropertyValues<this>): void {\n if (cp.has('useForm') && this.useForm && !this.#formId) {\n const r = (Math.random() + 1).toString(36).substring(7)\n this.#formId = `form-${r}`\n }\n }\n\n @bound\n protected handleFormSubmit(): void {\n if (this.submitClose) {\n this.handleInteraction('confirm')\n }\n }\n\n override handleClick(e: MouseEvent): void {\n super.handleClick(e)\n const path = e.composedPath()\n const { buttons } = this\n const button = path.find((i) => buttons.includes(i as HTMLElement)) as HTMLButtonElement | UiButton | undefined\n if (!button) {\n return\n }\n if (button.type === 'submit') {\n // Adds support for forms.\n // When a form's submit button is clicked we yield the flow control to the form.\n // This way the form can handle the submit event.\n return\n }\n const { value = '' } = button\n this.handleInteraction(value as 'dismiss' | 'confirm')\n }\n\n override handleKeyDown(e: KeyboardEvent): void {\n super.handleKeyDown(e)\n if (e.defaultPrevented) {\n return\n }\n if (e.key === 'Escape') {\n this.handleInteraction('dismiss')\n }\n }\n\n override updated(changedProperties: PropertyValues<this>): void {\n if (changedProperties.has('open')) {\n this.#controlVisibility()\n }\n super.updated(changedProperties)\n }\n\n #controlVisibility(): void {\n const { dialog, modal, open } = this\n if (!dialog) {\n return\n }\n if (open) {\n if (modal) {\n dialog.showModal()\n } else {\n dialog.show()\n }\n } else {\n dialog.close()\n }\n }\n\n #handleSlotChange(): void {\n const { icons, titles, buttons } = this\n this.hasIcon = !!icons && !!icons.length\n this.hasTitle = !!titles && !!titles.length\n this.hasButton = !!buttons && !!buttons.length\n }\n\n protected handleInteraction(value: 'dismiss' | 'confirm'): void {\n if (!['dismiss', 'confirm'].includes(value)) {\n return\n }\n\n const detail: UiDialogClosingReason = {\n cancelled: value === 'dismiss',\n }\n if (this.dialogValue !== undefined) {\n detail.value = this.dialogValue\n }\n\n // Dispatch cancelable closing event first\n const closingEvent = new CustomEvent<UiDialogClosingReason>('closing', {\n cancelable: true,\n composed: false,\n bubbles: false,\n detail,\n })\n const canClose = this.dispatchEvent(closingEvent)\n\n // Only proceed with closing if the event wasn't canceled\n if (!canClose) {\n return\n }\n\n this.open = false\n this.dispatchEvent(\n new CustomEvent<UiDialogClosingReason>('close', {\n composed: true,\n detail,\n })\n )\n }\n\n protected handleDialogClose(): void {\n if (!this.open) {\n return\n }\n\n const detail: UiDialogClosingReason = {\n cancelled: true,\n }\n if (this.dialogValue !== undefined) {\n detail.value = this.dialogValue\n }\n\n // Dispatch cancelable closing event first\n const closingEvent = new CustomEvent<UiDialogClosingReason>('closing', {\n cancelable: true,\n composed: false,\n bubbles: false,\n detail,\n })\n const canClose = this.dispatchEvent(closingEvent)\n\n // Only proceed with closing if the event wasn't canceled\n if (!canClose) {\n // If closing was prevented, reopen the dialog\n this.dialog.showModal()\n return\n }\n\n this.open = false\n this.dispatchEvent(\n new CustomEvent<UiDialogClosingReason>('close', {\n composed: true,\n detail,\n })\n )\n }\n\n protected handleDismiss(): void {\n this.handleInteraction('dismiss')\n }\n\n protected handleConfirm(): void {\n if (!this.useForm) {\n this.handleInteraction('confirm')\n }\n }\n\n #handleSubmit(event: SubmitEvent): void {\n const form = event.target as HTMLFormElement\n const copy = new SyntheticSubmitEvent(event.type, form, {\n submitter: event.submitter,\n cancelable: true,\n bubbles: false,\n composed: false,\n })\n const dispatched = this.dispatchEvent(copy)\n if (dispatched) {\n this.handleInteraction('confirm')\n } else {\n event.preventDefault()\n }\n }\n\n override render(): TemplateResult {\n const { useForm, modal } = this\n const dialogClass = modal ? 'modal' : 'non-modal'\n return html`\n <dialog @close=\"${this.handleDialogClose}\" part=\"dialog\" class=\"${dialogClass}\">\n <div class=\"container\">${useForm ? this.#renderFormContent() : this.renderContent()}</div>\n </dialog>\n `\n }\n\n protected renderContent(): TemplateResult[] | TemplateResult {\n return [this.renderIcon(), this.renderTitle(), this.renderBody(), this.renderButtons()]\n }\n\n #renderFormContent(): TemplateResult {\n return html`\n <form id=\"${ifDefined(this.formId)}\" method=\"dialog\" @submit=\"${this.#handleSubmit}\" part=\"form\">\n ${this.renderContent()}\n </form>\n `\n }\n\n protected renderIcon(): TemplateResult {\n const classes: ClassInfo = {\n 'icon': true,\n 'with-icon': this.hasIcon,\n 'destructive': this.destructive,\n }\n return html`\n <div class=\"${classMap(classes)}\" part=\"icon\">\n <slot name=\"icon\" @slotchange=\"${this.#handleSlotChange}\"></slot>\n </div>\n `\n }\n\n protected renderTitle(): TemplateResult {\n const classes: ClassInfo = {\n 'title': true,\n 'with-title': this.hasTitle,\n }\n return html`\n <div class=\"${classMap(classes)}\" part=\"title\">\n <slot name=\"title\" @slotchange=\"${this.#handleSlotChange}\"></slot>\n </div>\n `\n }\n\n protected renderBody(): TemplateResult {\n let content = this.#inject\n if (typeof content === 'function') {\n content = content()\n }\n const injected = content || nothing\n return html` <div class=\"content\" part=\"body\"><slot></slot>${injected}</div> `\n }\n\n protected renderButtons(): TemplateResult {\n const classes: ClassInfo = {\n 'buttons': true,\n 'with-buttons': this.hasButton || !!this.confirmLabel || !!this.dismissLabel,\n }\n return html`\n <div class=\"${classMap(classes)}\" part=\"button\">\n <slot name=\"button\" @slotchange=\"${this.#handleSlotChange}\"></slot>\n ${this.#renderDismissButton()} ${this.#renderConfirmButton()}\n </div>\n `\n }\n\n #renderDismissButton(): TemplateResult | typeof nothing {\n const { dismissLabel } = this\n if (!dismissLabel) {\n return nothing\n }\n return html`\n <ui-button\n color=\"text\"\n value=\"dismiss\"\n class=\"internal-button\"\n @click=\"${this.handleDismiss}\"\n part=\"negative-action\"\n >${dismissLabel}</ui-button\n >\n `\n }\n\n #renderConfirmButton(): TemplateResult | typeof nothing {\n const { confirmLabel, confirmValue = 'confirm', useForm, destructive } = this\n if (!confirmLabel) {\n return nothing\n }\n const type = useForm ? 'submit' : 'button'\n const buttonClass = destructive ? 'internal-button destructive' : 'internal-button'\n return html`\n <ui-button\n color=\"text\"\n type=\"${type}\"\n value=\"${confirmValue}\"\n class=\"${buttonClass}\"\n @click=\"${this.handleConfirm}\"\n part=\"positive-action\"\n >${confirmLabel}</ui-button\n >\n `\n }\n}\n"]}
1
+ {"version":3,"file":"Dialog.js","sourceRoot":"","sources":["../../../../../src/md/dialog/internals/Dialog.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, nothing, type PropertyValues, type TemplateResult } from 'lit'\nimport { property, query, queryAssignedElements, queryAssignedNodes, state } from 'lit/decorators.js'\nimport { type ClassInfo, classMap } from 'lit/directives/class-map.js'\nimport { UiElement } from '../../UiElement.js'\nimport { isDisabled, setDisabled } from '../../../lib/disabled.js'\nimport type UiButton from '../../button/internals/button.js'\nimport type { TypedEvents } from '../../../core/types.js'\nimport type { ButtonType } from '../../button/internals/button.js'\nimport '../../button/ui-button.js'\nimport { bound } from '../../../decorators/bound.js'\n\nexport interface UiDialogClosingReason {\n /**\n * Whether the dialog was cancelled by either activating the `dismiss` button\n * or by pressing escape.\n */\n cancelled: boolean\n /**\n * This is used in cases when the dialog has more complex purpose.\n * This is the value expected from the dialog.\n */\n value?: unknown\n}\n\ninterface DialogEventMap {\n closing: CustomEvent<UiDialogClosingReason>\n close: CustomEvent<UiDialogClosingReason>\n}\n\nexport type RenderFunction = () => TemplateResult\n\n/**\n * Styled dialog using a native `<dialog>` element under the hood.\n * Note, since native dialog renders in the top layer it is not necessary\n * to place the dialog in the `<body>`.\n *\n * **Using Buttons**\n *\n * The dialog automatically recognizes buttons with values `confirm` and `dismiss`\n * to close the dialog and dispatch the `close` event. The event has additional\n * closing reason detail.\n *\n * ```javascript\n * <ui-button slot=\"button\" color=\"text\" value=\"dismiss\">Cancel</ui-button>\n * <ui-button slot=\"button\" color=\"text\" value=\"confirm\">Take action</ui-button>\n * ```\n *\n * ```javascript\n * <button value=\"dismiss\">Cancel</button>\n * <button value=\"confirm\">Take action</button>\n * ```\n *\n * The detail object of the `close` event has the following properties:\n * - cancelled - Whether the dialog was cancelled by either activating the `dismiss` button or by pressing escape.\n *\n * The `close` event is only dispatched when the user interact with the dialog. Imperative control of the\n * dialog won't trigger the close button.\n *\n * ** Full example**\n *\n * ```javascript\n * <ui-dialog modal>\n * <ui-icon slot=\"icon\" icon=\"delete\"></ui-icon>\n *\n * <span slot=\"title\">Delete photos?</span>\n * <p>This action will permanently remove the selected pictures from your account.</p>\n *\n * <ui-button color=\"text\" slot=\"button\" value=\"dismiss\" type=\"text\">Cancel</ui-button>\n * <ui-button color=\"text\" slot=\"button\" value=\"confirm\" type=\"text\">Confirm</ui-button>\n * </ui-dialog>\n * ```\n *\n * @slot - The slot for the content of the dialog.\n * @slot icon - The slot to place the dialog icon\n * @slot title - The slot to place the dialog title. Do not put elements here, just the text.\n * @slot button - The slot to place the dialog buttons. Use the `confirm` or `dismiss`\n * buttons to automatically close the dialog.\n * @fires closing - A cancelable, non-bubbling event with the `UiDialogClosingReason` as the detail,\n * dispatched before the dialog closes. If prevented, the dialog will not close.\n * @fires close - A non-bubbling, non-cancellable event with the `UiDialogClosingReason` as the detail.\n */\nexport default class UiDialog extends UiElement implements TypedEvents<DialogEventMap> {\n get disabled(): boolean {\n return isDisabled(this)\n }\n\n /**\n * When set, the button is a disabled state.\n * @attribute\n */\n @property({ reflect: true, type: Boolean })\n set disabled(value: boolean) {\n const old = isDisabled(this)\n setDisabled(this, value)\n this.requestUpdate('disabled', old)\n }\n\n /**\n * Opens the dialog as modal when toggling dialog's open state.\n *\n * Setting this value after the dialog was opened has no effect.\n *\n * @attribute\n */\n @property({ type: Boolean }) accessor modal = false\n\n /**\n * Toggles visibility of the dialog.\n * Note, the dialog is opened asynchronously after the update is performed.\n * @attribute\n */\n @property({ type: Boolean }) accessor open = false\n\n /**\n * Imperative access to create a dismiss button.\n * When set this will render a dismiss button at the end of the buttons line, before the `confirmLabel` button.\n * @attribute\n */\n @property({ type: String }) accessor dismissLabel: string | undefined\n\n /**\n * Imperative access to create a confirm button.\n * When set this will render a confirm button at the end of the buttons line, after the `dismissLabel` button.\n * @attribute\n */\n @property({ type: String }) accessor confirmLabel: string | undefined\n\n /**\n * When true, styles the confirm button with error colors to indicate\n * a destructive action (e.g., delete, remove, etc.).\n * @attribute\n */\n @property({ type: Boolean }) accessor destructive = false\n\n /**\n * Only when `confirmLabel` is set.\n * Defines the value associated with the button's name when it's submitted with the form data.\n * @see {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#value}\n * @attribute\n */\n @property({ type: String }) accessor confirmValue: string | undefined\n\n /**\n * The type of the confirm button.\n * This is used to set the button's `type` attribute.\n * If not set, the default is `button`.\n * If set to `submit`, the dialog will trigger the form submission on the parent form.\n * @attribute\n */\n @property({ type: String }) accessor confirmType: ButtonType | undefined\n /**\n * When the dialog is wrapped in a form, set this to `true` to close the dialog\n * when the form is submitted.\n *\n * Note that the dialog doesn't perform any validation of the form. It only closes\n * when the form is submitted, regardless of the application logic. The `submit` event\n * is dispatched by the dialog when the form is valid.\n * @attribute\n */\n @property({ type: Boolean }) accessor submitClose: boolean | undefined\n\n /**\n * A reference to the underlying dialog element.\n */\n @query('dialog') accessor dialog!: HTMLDialogElement\n\n @state() protected accessor hasIcon = false\n\n @state() protected accessor hasTitle = false\n\n @state() protected accessor hasButton = false\n\n @queryAssignedElements({ flatten: true, slot: 'icon' }) protected accessor icons!: HTMLElement[]\n\n @queryAssignedNodes({ flatten: true, slot: 'title' }) protected accessor titles!: HTMLElement[]\n\n @queryAssignedElements({ flatten: true, slot: 'button' }) protected accessor buttons!: HTMLElement[]\n\n /**\n * To be set by a child class when closing the dialog.\n * This is passed to the close event.\n */\n dialogValue?: unknown\n\n /**\n * A reference to the parent form element.\n * When a form is found, the dialog will hook into the form's submit event\n * and close the dialog when the form is submitted.\n * Since the `submit` event is dispatched when the form is valid,\n * we can use this to close the dialog and not worry about the form validation.\n */\n #form: HTMLFormElement | null = null\n\n constructor() {\n super()\n\n this.addEventListener('click', this.handleClick)\n this.addEventListener('keydown', this.handleKeyDown)\n }\n\n override connectedCallback(): void {\n super.connectedCallback()\n this.#form = this.closest('form')\n if (this.#form) {\n this.#form.addEventListener('submit', this.handleFormSubmit)\n }\n }\n\n override disconnectedCallback(): void {\n super.disconnectedCallback()\n if (this.#form) {\n this.#form.removeEventListener('submit', this.handleFormSubmit)\n this.#form = null\n }\n }\n\n @bound\n protected handleFormSubmit(): void {\n if (this.submitClose) {\n this.handleInteraction('confirm')\n }\n }\n\n override handleClick(e: MouseEvent): void {\n super.handleClick(e)\n const path = e.composedPath()\n const { buttons } = this\n const button = path.find((i) => buttons.includes(i as HTMLElement)) as HTMLButtonElement | UiButton | undefined\n if (!button) {\n return\n }\n if (button.type === 'submit') {\n // Adds support for forms.\n // When a form's submit button is clicked we yield the flow control to the form.\n // This way the form can handle the submit event.\n return\n }\n const { value = '' } = button\n this.handleInteraction(value as 'dismiss' | 'confirm')\n }\n\n override handleKeyDown(e: KeyboardEvent): void {\n super.handleKeyDown(e)\n if (e.defaultPrevented) {\n return\n }\n if (e.key === 'Escape') {\n this.handleInteraction('dismiss')\n }\n }\n\n override updated(changedProperties: PropertyValues<this>): void {\n if (changedProperties.has('open')) {\n this.#controlVisibility()\n }\n super.updated(changedProperties)\n }\n\n #controlVisibility(): void {\n const { dialog, modal, open } = this\n if (!dialog) {\n return\n }\n if (open) {\n if (modal) {\n dialog.showModal()\n } else {\n dialog.show()\n }\n } else {\n dialog.close()\n }\n }\n\n #handleSlotChange(): void {\n const { icons, titles, buttons } = this\n this.hasIcon = !!icons && !!icons.length\n this.hasTitle = !!titles && !!titles.length\n this.hasButton = !!buttons && !!buttons.length\n }\n\n protected handleInteraction(value: 'dismiss' | 'confirm'): void {\n if (!['dismiss', 'confirm'].includes(value)) {\n return\n }\n\n const detail: UiDialogClosingReason = {\n cancelled: value === 'dismiss',\n }\n if (this.dialogValue !== undefined) {\n detail.value = this.dialogValue\n }\n\n // Dispatch cancelable closing event first\n const closingEvent = new CustomEvent<UiDialogClosingReason>('closing', {\n cancelable: true,\n composed: false,\n bubbles: false,\n detail,\n })\n const canClose = this.dispatchEvent(closingEvent)\n\n // Only proceed with closing if the event wasn't canceled\n if (!canClose) {\n return\n }\n\n this.open = false\n this.dispatchEvent(\n new CustomEvent<UiDialogClosingReason>('close', {\n composed: true,\n detail,\n })\n )\n }\n\n protected handleDialogClose(): void {\n if (!this.open) {\n return\n }\n\n const detail: UiDialogClosingReason = {\n cancelled: true,\n }\n if (this.dialogValue !== undefined) {\n detail.value = this.dialogValue\n }\n\n // Dispatch cancelable closing event first\n const closingEvent = new CustomEvent<UiDialogClosingReason>('closing', {\n cancelable: true,\n composed: false,\n bubbles: false,\n detail,\n })\n const canClose = this.dispatchEvent(closingEvent)\n\n // Only proceed with closing if the event wasn't canceled\n if (!canClose) {\n // If closing was prevented, reopen the dialog\n this.dialog.showModal()\n return\n }\n\n this.open = false\n this.dispatchEvent(\n new CustomEvent<UiDialogClosingReason>('close', {\n composed: true,\n detail,\n })\n )\n }\n\n protected handleDismiss(): void {\n this.handleInteraction('dismiss')\n }\n\n protected handleConfirm(): void {\n this.handleInteraction('confirm')\n }\n\n override render(): TemplateResult {\n const { modal } = this\n const dialogClass = modal ? 'modal' : 'non-modal'\n return html`\n <dialog @close=\"${this.handleDialogClose}\" part=\"dialog\" class=\"${dialogClass}\">\n <div class=\"container\">${this.renderContent()}</div>\n </dialog>\n `\n }\n\n protected renderContent(): TemplateResult[] | TemplateResult {\n return [this.renderIcon(), this.renderTitle(), this.renderBody(), this.renderButtons()]\n }\n\n protected renderIcon(): TemplateResult {\n const classes: ClassInfo = {\n 'icon': true,\n 'with-icon': this.hasIcon,\n 'destructive': this.destructive,\n }\n return html`\n <div class=\"${classMap(classes)}\" part=\"icon\">\n <slot name=\"icon\" @slotchange=\"${this.#handleSlotChange}\"></slot>\n </div>\n `\n }\n\n protected renderTitle(): TemplateResult {\n const classes: ClassInfo = {\n 'title': true,\n 'with-title': this.hasTitle,\n }\n return html`\n <div class=\"${classMap(classes)}\" part=\"title\">\n <slot name=\"title\" @slotchange=\"${this.#handleSlotChange}\"></slot>\n </div>\n `\n }\n\n protected renderBody(): TemplateResult {\n return html` <div class=\"content\" part=\"body\"><slot></slot></div> `\n }\n\n protected renderButtons(): TemplateResult {\n const classes: ClassInfo = {\n 'buttons': true,\n 'with-buttons': this.hasButton || !!this.confirmLabel || !!this.dismissLabel,\n }\n return html`\n <div class=\"${classMap(classes)}\" part=\"button\">\n <slot name=\"button\" @slotchange=\"${this.#handleSlotChange}\"></slot>\n ${this.#renderDismissButton()} ${this.#renderConfirmButton()}\n </div>\n `\n }\n\n #renderDismissButton(): TemplateResult | typeof nothing {\n const { dismissLabel } = this\n if (!dismissLabel) {\n return nothing\n }\n return html`\n <ui-button\n color=\"text\"\n value=\"dismiss\"\n class=\"internal-button\"\n @click=\"${this.handleDismiss}\"\n part=\"negative-action\"\n >${dismissLabel}</ui-button\n >\n `\n }\n\n #renderConfirmButton(): TemplateResult | typeof nothing {\n const { confirmLabel, confirmValue = 'confirm', destructive } = this\n if (!confirmLabel) {\n return nothing\n }\n const type = this.confirmType ?? 'button'\n const buttonClass = destructive ? 'internal-button destructive' : 'internal-button'\n return html`\n <ui-button\n color=\"text\"\n type=\"${type}\"\n value=\"${confirmValue}\"\n class=\"${buttonClass}\"\n @click=\"${this.handleConfirm}\"\n part=\"positive-action\"\n >${confirmLabel}</ui-button\n >\n `\n }\n}\n"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@api-client/ui",
3
- "version": "0.5.20",
3
+ "version": "0.5.21",
4
4
  "description": "Internal UI component library for the API Client ecosystem.",
5
5
  "license": "UNLICENSED",
6
6
  "main": "build/src/index.js",
@@ -1,12 +1,11 @@
1
- import { type CSSResultOrNative, html, nothing, type PropertyValues, type TemplateResult, adoptStyles } from 'lit'
1
+ import { html, nothing, type PropertyValues, type TemplateResult } from 'lit'
2
2
  import { property, query, queryAssignedElements, queryAssignedNodes, state } from 'lit/decorators.js'
3
3
  import { type ClassInfo, classMap } from 'lit/directives/class-map.js'
4
4
  import { UiElement } from '../../UiElement.js'
5
5
  import { isDisabled, setDisabled } from '../../../lib/disabled.js'
6
6
  import type UiButton from '../../button/internals/button.js'
7
7
  import type { TypedEvents } from '../../../core/types.js'
8
- import { ifDefined } from 'lit/directives/if-defined.js'
9
- import { SyntheticSubmitEvent } from '../../../events/SyntheticSubmitEvent.js'
8
+ import type { ButtonType } from '../../button/internals/button.js'
10
9
  import '../../button/ui-button.js'
11
10
  import { bound } from '../../../decorators/bound.js'
12
11
 
@@ -42,8 +41,8 @@ export type RenderFunction = () => TemplateResult
42
41
  * closing reason detail.
43
42
  *
44
43
  * ```javascript
45
- * <ui-button color="text" value="dismiss">Cancel</ui-button>
46
- * <ui-button color="text" value="confirm">Take action</ui-button>
44
+ * <ui-button slot="button" color="text" value="dismiss">Cancel</ui-button>
45
+ * <ui-button slot="button" color="text" value="confirm">Take action</ui-button>
47
46
  * ```
48
47
  *
49
48
  * ```javascript
@@ -133,26 +132,6 @@ export default class UiDialog extends UiElement implements TypedEvents<DialogEve
133
132
  */
134
133
  @property({ type: Boolean }) accessor destructive = false
135
134
 
136
- /**
137
- * Part of the imperative access to the element.
138
- * When set, it wraps the content in a `<form>` element.
139
- * When this is enabled the following will happen:
140
- * - The `confirm` button will get `type="submit"`
141
- * - The form `method` attribute is set to `dialog`
142
- * - The form `id` attribute is set to a random string. You can get it from the `formId` getter.
143
- * - The dialog will dispatch the same `submit` event as the form.
144
- * - When the `submit` event dispatched by the dialog gets cancelled, then:
145
- * - The original submit event also gets cancelled.
146
- * - The default confirm action is not invoked
147
- * - The dialog stays opened
148
- * - When the submit event is not cancelled, then:
149
- * - The default confirm action is invoked.
150
- * - The dialog is closed.
151
- *
152
- * @deprecated Wrap the content in a `<form>` element instead.
153
- */
154
- @property({ type: Boolean }) accessor useForm: boolean | undefined
155
-
156
135
  /**
157
136
  * Only when `confirmLabel` is set.
158
137
  * Defines the value associated with the button's name when it's submitted with the form data.
@@ -160,6 +139,15 @@ export default class UiDialog extends UiElement implements TypedEvents<DialogEve
160
139
  * @attribute
161
140
  */
162
141
  @property({ type: String }) accessor confirmValue: string | undefined
142
+
143
+ /**
144
+ * The type of the confirm button.
145
+ * This is used to set the button's `type` attribute.
146
+ * If not set, the default is `button`.
147
+ * If set to `submit`, the dialog will trigger the form submission on the parent form.
148
+ * @attribute
149
+ */
150
+ @property({ type: String }) accessor confirmType: ButtonType | undefined
163
151
  /**
164
152
  * When the dialog is wrapped in a form, set this to `true` to close the dialog
165
153
  * when the form is submitted.
@@ -167,6 +155,7 @@ export default class UiDialog extends UiElement implements TypedEvents<DialogEve
167
155
  * Note that the dialog doesn't perform any validation of the form. It only closes
168
156
  * when the form is submitted, regardless of the application logic. The `submit` event
169
157
  * is dispatched by the dialog when the form is valid.
158
+ * @attribute
170
159
  */
171
160
  @property({ type: Boolean }) accessor submitClose: boolean | undefined
172
161
 
@@ -193,25 +182,6 @@ export default class UiDialog extends UiElement implements TypedEvents<DialogEve
193
182
  */
194
183
  dialogValue?: unknown
195
184
 
196
- #formId?: string
197
-
198
- /**
199
- * @deprecated Use `useForm` instead.
200
- */
201
- get formId(): string | undefined {
202
- return this.#formId
203
- }
204
-
205
- /**
206
- * @deprecated This will be removed in the future.
207
- */
208
- @state() accessor #inject: TemplateResult | RenderFunction | undefined
209
-
210
- /**
211
- * @deprecated This will be removed in the future.
212
- */
213
- #pendingStyles?: CSSResultOrNative[]
214
-
215
185
  /**
216
186
  * A reference to the parent form element.
217
187
  * When a form is found, the dialog will hook into the form's submit event
@@ -228,29 +198,6 @@ export default class UiDialog extends UiElement implements TypedEvents<DialogEve
228
198
  this.addEventListener('keydown', this.handleKeyDown)
229
199
  }
230
200
 
231
- /**
232
- * Allows to inject a template into the internals of the element.
233
- * This is helpful when working with imperative dialogs.
234
- * @param content The content to inject into the body.
235
- * @deprecated This will be removed in the future. To use forms, wrap the content in a `<form>` element.
236
- */
237
- inject(content?: TemplateResult | RenderFunction, styles?: CSSResultOrNative[]): void {
238
- this.#inject = content
239
- if (styles) {
240
- if (this.shadowRoot) {
241
- adoptStyles(this.shadowRoot, styles)
242
- } else {
243
- if (!this.#pendingStyles) {
244
- this.#pendingStyles = []
245
- }
246
- this.#pendingStyles.push(...styles)
247
- }
248
- }
249
- if (this.shadowRoot && styles) {
250
- adoptStyles(this.shadowRoot, styles)
251
- }
252
- }
253
-
254
201
  override connectedCallback(): void {
255
202
  super.connectedCallback()
256
203
  this.#form = this.closest('form')
@@ -267,22 +214,6 @@ export default class UiDialog extends UiElement implements TypedEvents<DialogEve
267
214
  }
268
215
  }
269
216
 
270
- protected override firstUpdated(): void {
271
- const styles = this.#pendingStyles
272
- if (styles) {
273
- const root = this.shadowRoot as ShadowRoot
274
- const all = [...root.adoptedStyleSheets, ...styles]
275
- adoptStyles(this.shadowRoot as ShadowRoot, all)
276
- }
277
- }
278
-
279
- override willUpdate(cp: PropertyValues<this>): void {
280
- if (cp.has('useForm') && this.useForm && !this.#formId) {
281
- const r = (Math.random() + 1).toString(36).substring(7)
282
- this.#formId = `form-${r}`
283
- }
284
- }
285
-
286
217
  @bound
287
218
  protected handleFormSubmit(): void {
288
219
  if (this.submitClose) {
@@ -425,33 +356,15 @@ export default class UiDialog extends UiElement implements TypedEvents<DialogEve
425
356
  }
426
357
 
427
358
  protected handleConfirm(): void {
428
- if (!this.useForm) {
429
- this.handleInteraction('confirm')
430
- }
431
- }
432
-
433
- #handleSubmit(event: SubmitEvent): void {
434
- const form = event.target as HTMLFormElement
435
- const copy = new SyntheticSubmitEvent(event.type, form, {
436
- submitter: event.submitter,
437
- cancelable: true,
438
- bubbles: false,
439
- composed: false,
440
- })
441
- const dispatched = this.dispatchEvent(copy)
442
- if (dispatched) {
443
- this.handleInteraction('confirm')
444
- } else {
445
- event.preventDefault()
446
- }
359
+ this.handleInteraction('confirm')
447
360
  }
448
361
 
449
362
  override render(): TemplateResult {
450
- const { useForm, modal } = this
363
+ const { modal } = this
451
364
  const dialogClass = modal ? 'modal' : 'non-modal'
452
365
  return html`
453
366
  <dialog @close="${this.handleDialogClose}" part="dialog" class="${dialogClass}">
454
- <div class="container">${useForm ? this.#renderFormContent() : this.renderContent()}</div>
367
+ <div class="container">${this.renderContent()}</div>
455
368
  </dialog>
456
369
  `
457
370
  }
@@ -460,14 +373,6 @@ export default class UiDialog extends UiElement implements TypedEvents<DialogEve
460
373
  return [this.renderIcon(), this.renderTitle(), this.renderBody(), this.renderButtons()]
461
374
  }
462
375
 
463
- #renderFormContent(): TemplateResult {
464
- return html`
465
- <form id="${ifDefined(this.formId)}" method="dialog" @submit="${this.#handleSubmit}" part="form">
466
- ${this.renderContent()}
467
- </form>
468
- `
469
- }
470
-
471
376
  protected renderIcon(): TemplateResult {
472
377
  const classes: ClassInfo = {
473
378
  'icon': true,
@@ -494,12 +399,7 @@ export default class UiDialog extends UiElement implements TypedEvents<DialogEve
494
399
  }
495
400
 
496
401
  protected renderBody(): TemplateResult {
497
- let content = this.#inject
498
- if (typeof content === 'function') {
499
- content = content()
500
- }
501
- const injected = content || nothing
502
- return html` <div class="content" part="body"><slot></slot>${injected}</div> `
402
+ return html` <div class="content" part="body"><slot></slot></div> `
503
403
  }
504
404
 
505
405
  protected renderButtons(): TemplateResult {
@@ -533,11 +433,11 @@ export default class UiDialog extends UiElement implements TypedEvents<DialogEve
533
433
  }
534
434
 
535
435
  #renderConfirmButton(): TemplateResult | typeof nothing {
536
- const { confirmLabel, confirmValue = 'confirm', useForm, destructive } = this
436
+ const { confirmLabel, confirmValue = 'confirm', destructive } = this
537
437
  if (!confirmLabel) {
538
438
  return nothing
539
439
  }
540
- const type = useForm ? 'submit' : 'button'
440
+ const type = this.confirmType ?? 'button'
541
441
  const buttonClass = destructive ? 'internal-button destructive' : 'internal-button'
542
442
  return html`
543
443
  <ui-button
@@ -1,9 +0,0 @@
1
- export declare class SyntheticSubmitEvent extends Event {
2
- #private;
3
- constructor(type: string, form: HTMLFormElement, eventInitDict?: SubmitEventInit);
4
- get form(): HTMLFormElement;
5
- get submitter(): HTMLElement | null | undefined;
6
- get target(): HTMLFormElement;
7
- get currentTarget(): HTMLFormElement;
8
- }
9
- //# sourceMappingURL=SyntheticSubmitEvent.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"SyntheticSubmitEvent.d.ts","sourceRoot":"","sources":["../../../src/events/SyntheticSubmitEvent.ts"],"names":[],"mappings":"AAAA,qBAAa,oBAAqB,SAAQ,KAAK;;gBAKjC,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,eAAe,EAAE,aAAa,CAAC,EAAE,eAAe;IAMhF,IAAI,IAAI,IAAI,eAAe,CAE1B;IAED,IAAI,SAAS,IAAI,WAAW,GAAG,IAAI,GAAG,SAAS,CAE9C;IAED,IAAa,MAAM,IAAI,eAAe,CAErC;IAED,IAAa,aAAa,IAAI,eAAe,CAE5C;CACF"}
@@ -1,22 +0,0 @@
1
- export class SyntheticSubmitEvent extends Event {
2
- #form;
3
- #submitter;
4
- constructor(type, form, eventInitDict) {
5
- super(type, eventInitDict);
6
- this.#form = form;
7
- this.#submitter = eventInitDict?.submitter;
8
- }
9
- get form() {
10
- return this.#form;
11
- }
12
- get submitter() {
13
- return this.#submitter;
14
- }
15
- get target() {
16
- return this.#form;
17
- }
18
- get currentTarget() {
19
- return this.#form;
20
- }
21
- }
22
- //# sourceMappingURL=SyntheticSubmitEvent.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"SyntheticSubmitEvent.js","sourceRoot":"","sources":["../../../src/events/SyntheticSubmitEvent.ts"],"names":[],"mappings":"AAAA,MAAM,OAAO,oBAAqB,SAAQ,KAAK;IAC7C,KAAK,CAAiB;IAEtB,UAAU,CAAqB;IAE/B,YAAY,IAAY,EAAE,IAAqB,EAAE,aAA+B;QAC9E,KAAK,CAAC,IAAI,EAAE,aAAa,CAAC,CAAA;QAC1B,IAAI,CAAC,KAAK,GAAG,IAAI,CAAA;QACjB,IAAI,CAAC,UAAU,GAAG,aAAa,EAAE,SAAS,CAAA;IAC5C,CAAC;IAED,IAAI,IAAI;QACN,OAAO,IAAI,CAAC,KAAK,CAAA;IACnB,CAAC;IAED,IAAI,SAAS;QACX,OAAO,IAAI,CAAC,UAAU,CAAA;IACxB,CAAC;IAED,IAAa,MAAM;QACjB,OAAO,IAAI,CAAC,KAAK,CAAA;IACnB,CAAC;IAED,IAAa,aAAa;QACxB,OAAO,IAAI,CAAC,KAAK,CAAA;IACnB,CAAC;CACF","sourcesContent":["export class SyntheticSubmitEvent extends Event {\n #form: HTMLFormElement\n\n #submitter?: HTMLElement | null\n\n constructor(type: string, form: HTMLFormElement, eventInitDict?: SubmitEventInit) {\n super(type, eventInitDict)\n this.#form = form\n this.#submitter = eventInitDict?.submitter\n }\n\n get form(): HTMLFormElement {\n return this.#form\n }\n\n get submitter(): HTMLElement | null | undefined {\n return this.#submitter\n }\n\n override get target(): HTMLFormElement {\n return this.#form\n }\n\n override get currentTarget(): HTMLFormElement {\n return this.#form\n }\n}\n"]}
@@ -1,27 +0,0 @@
1
- export class SyntheticSubmitEvent extends Event {
2
- #form: HTMLFormElement
3
-
4
- #submitter?: HTMLElement | null
5
-
6
- constructor(type: string, form: HTMLFormElement, eventInitDict?: SubmitEventInit) {
7
- super(type, eventInitDict)
8
- this.#form = form
9
- this.#submitter = eventInitDict?.submitter
10
- }
11
-
12
- get form(): HTMLFormElement {
13
- return this.#form
14
- }
15
-
16
- get submitter(): HTMLElement | null | undefined {
17
- return this.#submitter
18
- }
19
-
20
- override get target(): HTMLFormElement {
21
- return this.#form
22
- }
23
-
24
- override get currentTarget(): HTMLFormElement {
25
- return this.#form
26
- }
27
- }