@statistikzh/leu 0.22.0 → 0.22.1

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.
Files changed (190) hide show
  1. package/.github/workflows/release-please.yml +1 -2
  2. package/.nvmrc +1 -1
  3. package/.release-please-manifest.json +1 -1
  4. package/CHANGELOG.md +9 -0
  5. package/README.md +15 -10
  6. package/dist/Accordion.js +1 -1
  7. package/dist/Button.d.ts +1 -1
  8. package/dist/Button.js +1 -1
  9. package/dist/ButtonGroup.js +1 -1
  10. package/dist/ChartWrapper.js +1 -1
  11. package/dist/Checkbox.d.ts +1 -1
  12. package/dist/Checkbox.js +1 -1
  13. package/dist/CheckboxGroup.js +1 -1
  14. package/dist/Chip.d.ts +1 -7
  15. package/dist/Chip.js +7 -5
  16. package/dist/ChipGroup.d.ts +17 -36
  17. package/dist/ChipGroup.js +35 -33
  18. package/dist/ChipLink.d.ts +5 -21
  19. package/dist/ChipLink.js +14 -15
  20. package/dist/ChipRemovable.d.ts +4 -15
  21. package/dist/ChipRemovable.js +7 -9
  22. package/dist/ChipSelectable.d.ts +14 -37
  23. package/dist/ChipSelectable.js +24 -28
  24. package/dist/Dialog.d.ts +7 -18
  25. package/dist/Dialog.js +15 -18
  26. package/dist/Dropdown.d.ts +16 -28
  27. package/dist/Dropdown.js +22 -23
  28. package/dist/FileInput.d.ts +2 -1
  29. package/dist/FileInput.js +19 -5
  30. package/dist/Icon.d-itcQ94ym.d.ts +151 -0
  31. package/dist/Icon.d.ts +4 -156
  32. package/dist/Icon.js +1 -4
  33. package/dist/Input.d.ts +73 -141
  34. package/dist/Input.js +91 -88
  35. package/dist/{LeuElement-BooZrClI.js → LeuElement-DfsEye-A.js} +1 -1
  36. package/dist/Menu.d.ts +2 -8
  37. package/dist/Menu.js +7 -9
  38. package/dist/MenuItem.d.ts +31 -59
  39. package/dist/MenuItem.js +30 -33
  40. package/dist/Message.d.ts +1 -1
  41. package/dist/Message.js +1 -1
  42. package/dist/Pagination.d.ts +1 -1
  43. package/dist/Pagination.js +1 -1
  44. package/dist/Placeholder.js +1 -1
  45. package/dist/Popup.js +1 -1
  46. package/dist/ProgressBar.js +1 -1
  47. package/dist/Radio.js +1 -1
  48. package/dist/RadioGroup.js +1 -1
  49. package/dist/Range.d.ts +22 -65
  50. package/dist/Range.js +36 -37
  51. package/dist/ScrollTop.d.ts +5 -7
  52. package/dist/ScrollTop.js +10 -15
  53. package/dist/Select.d.ts +2 -1
  54. package/dist/Select.js +1 -1
  55. package/dist/Spinner.js +1 -1
  56. package/dist/Table.d.ts +1 -1
  57. package/dist/Table.js +1 -1
  58. package/dist/Tag.js +1 -1
  59. package/dist/VisuallyHidden.js +1 -1
  60. package/dist/components/chart-wrapper/leu-chart-wrapper.d.ts +5 -0
  61. package/dist/components/chart-wrapper/leu-chart-wrapper.d.ts.map +1 -1
  62. package/dist/components/chip/Chip.d.ts +1 -7
  63. package/dist/components/chip/Chip.d.ts.map +1 -1
  64. package/dist/components/chip/ChipGroup.d.ts +15 -35
  65. package/dist/components/chip/ChipGroup.d.ts.map +1 -1
  66. package/dist/components/chip/ChipLink.d.ts +4 -20
  67. package/dist/components/chip/ChipLink.d.ts.map +1 -1
  68. package/dist/components/chip/ChipRemovable.d.ts +3 -14
  69. package/dist/components/chip/ChipRemovable.d.ts.map +1 -1
  70. package/dist/components/chip/ChipSelectable.d.ts +13 -36
  71. package/dist/components/chip/ChipSelectable.d.ts.map +1 -1
  72. package/dist/components/chip/stories/chip-group.stories.d.ts +1 -1
  73. package/dist/components/chip/stories/chip-group.stories.d.ts.map +1 -1
  74. package/dist/components/chip/stories/chip-link.stories.d.ts.map +1 -1
  75. package/dist/components/chip/stories/chip-selectable.stories.d.ts.map +1 -1
  76. package/dist/components/dialog/Dialog.d.ts +5 -17
  77. package/dist/components/dialog/Dialog.d.ts.map +1 -1
  78. package/dist/components/dropdown/Dropdown.d.ts +14 -27
  79. package/dist/components/dropdown/Dropdown.d.ts.map +1 -1
  80. package/dist/components/file-input/FileInput.d.ts +1 -0
  81. package/dist/components/file-input/FileInput.d.ts.map +1 -1
  82. package/dist/components/file-input/leu-file-input.d.ts +5 -0
  83. package/dist/components/file-input/leu-file-input.d.ts.map +1 -1
  84. package/dist/components/file-input/stories/file-input.stories.d.ts +4 -0
  85. package/dist/components/file-input/stories/file-input.stories.d.ts.map +1 -1
  86. package/dist/components/icon/Icon.d.ts +0 -6
  87. package/dist/components/icon/Icon.d.ts.map +1 -1
  88. package/dist/components/input/Input.d.ts +73 -140
  89. package/dist/components/input/Input.d.ts.map +1 -1
  90. package/dist/components/menu/Menu.d.ts +1 -7
  91. package/dist/components/menu/Menu.d.ts.map +1 -1
  92. package/dist/components/menu/MenuItem.d.ts +30 -57
  93. package/dist/components/menu/MenuItem.d.ts.map +1 -1
  94. package/dist/components/message/leu-message.d.ts +5 -0
  95. package/dist/components/message/leu-message.d.ts.map +1 -1
  96. package/dist/components/placeholder/leu-placeholder.d.ts +5 -0
  97. package/dist/components/placeholder/leu-placeholder.d.ts.map +1 -1
  98. package/dist/components/progress-bar/leu-progress-bar.d.ts +5 -0
  99. package/dist/components/progress-bar/leu-progress-bar.d.ts.map +1 -1
  100. package/dist/components/range/Range.d.ts +22 -65
  101. package/dist/components/range/Range.d.ts.map +1 -1
  102. package/dist/components/scroll-top/ScrollTop.d.ts +4 -6
  103. package/dist/components/scroll-top/ScrollTop.d.ts.map +1 -1
  104. package/dist/components/tag/leu-tag.d.ts +5 -0
  105. package/dist/components/tag/leu-tag.d.ts.map +1 -1
  106. package/dist/index.d.ts +11 -0
  107. package/dist/index.d.ts.map +1 -1
  108. package/dist/index.js +13 -4
  109. package/dist/leu-accordion.js +1 -1
  110. package/dist/leu-button-group.js +1 -1
  111. package/dist/leu-button.d.ts +1 -1
  112. package/dist/leu-button.js +1 -1
  113. package/dist/leu-chart-wrapper.d.ts +10 -1
  114. package/dist/leu-chart-wrapper.js +1 -1
  115. package/dist/leu-checkbox-group.js +1 -1
  116. package/dist/leu-checkbox.d.ts +1 -1
  117. package/dist/leu-checkbox.js +1 -1
  118. package/dist/leu-chip-group.d.ts +2 -0
  119. package/dist/leu-chip-group.js +5 -1
  120. package/dist/leu-chip-link.js +3 -1
  121. package/dist/leu-chip-removable.d.ts +1 -1
  122. package/dist/leu-chip-removable.js +3 -3
  123. package/dist/leu-chip-selectable.js +3 -1
  124. package/dist/leu-dialog.d.ts +2 -1
  125. package/dist/leu-dialog.js +3 -3
  126. package/dist/leu-dropdown.d.ts +2 -1
  127. package/dist/leu-dropdown.js +3 -3
  128. package/dist/leu-file-input.d.ts +11 -2
  129. package/dist/leu-file-input.js +11 -4
  130. package/dist/leu-icon.d.ts +1 -1
  131. package/dist/leu-icon.js +1 -1
  132. package/dist/leu-input.d.ts +2 -1
  133. package/dist/leu-input.js +3 -3
  134. package/dist/leu-menu-item.d.ts +2 -2
  135. package/dist/leu-menu-item.js +3 -3
  136. package/dist/leu-menu.d.ts +1 -1
  137. package/dist/leu-menu.js +3 -3
  138. package/dist/leu-message.d.ts +11 -2
  139. package/dist/leu-message.js +1 -1
  140. package/dist/leu-pagination.d.ts +1 -1
  141. package/dist/leu-pagination.js +1 -1
  142. package/dist/leu-placeholder.d.ts +10 -1
  143. package/dist/leu-placeholder.js +1 -1
  144. package/dist/leu-popup.js +1 -1
  145. package/dist/leu-progress-bar.d.ts +10 -1
  146. package/dist/leu-progress-bar.js +1 -1
  147. package/dist/leu-radio-group.js +1 -1
  148. package/dist/leu-radio.js +1 -1
  149. package/dist/leu-range.js +3 -1
  150. package/dist/leu-scroll-top.d.ts +1 -1
  151. package/dist/leu-scroll-top.js +3 -3
  152. package/dist/leu-select.d.ts +2 -1
  153. package/dist/leu-select.js +1 -1
  154. package/dist/leu-spinner.js +1 -1
  155. package/dist/leu-table.d.ts +1 -1
  156. package/dist/leu-table.js +1 -1
  157. package/dist/leu-tag.d.ts +10 -1
  158. package/dist/leu-tag.js +1 -1
  159. package/dist/leu-visually-hidden.js +1 -1
  160. package/dist/vscode.html-custom-data.json +126 -123
  161. package/dist/vue/index.d.ts +129 -146
  162. package/dist/web-types.json +340 -345
  163. package/package.json +1 -1
  164. package/scripts/generate-component/templates/[namespace]-[name].ts +6 -0
  165. package/src/components/chart-wrapper/leu-chart-wrapper.ts +6 -0
  166. package/src/components/chip/Chip.ts +3 -9
  167. package/src/components/chip/ChipGroup.ts +26 -39
  168. package/src/components/chip/ChipLink.ts +7 -18
  169. package/src/components/chip/ChipRemovable.ts +4 -11
  170. package/src/components/chip/ChipSelectable.ts +21 -35
  171. package/src/components/chip/stories/chip-group.stories.ts +4 -7
  172. package/src/components/chip/stories/chip-link.stories.ts +2 -4
  173. package/src/components/chip/stories/chip-selectable.stories.ts +4 -6
  174. package/src/components/chip/test/chip-group.test.ts +34 -31
  175. package/src/components/dialog/Dialog.ts +9 -22
  176. package/src/components/dropdown/Dropdown.ts +19 -26
  177. package/src/components/file-input/FileInput.ts +12 -1
  178. package/src/components/file-input/leu-file-input.ts +6 -0
  179. package/src/components/file-input/stories/file-input.stories.ts +7 -0
  180. package/src/components/icon/Icon.ts +0 -4
  181. package/src/components/input/Input.ts +108 -105
  182. package/src/components/menu/Menu.ts +3 -12
  183. package/src/components/menu/MenuItem.ts +37 -41
  184. package/src/components/message/leu-message.ts +6 -0
  185. package/src/components/placeholder/leu-placeholder.ts +6 -0
  186. package/src/components/progress-bar/leu-progress-bar.ts +6 -0
  187. package/src/components/range/Range.ts +51 -59
  188. package/src/components/scroll-top/ScrollTop.ts +8 -15
  189. package/src/components/tag/leu-tag.ts +6 -0
  190. package/src/index.ts +11 -0
package/dist/Input.js CHANGED
@@ -1,12 +1,12 @@
1
+ import { _ as __decorate } from './_tslib-CNEFicEt.js';
1
2
  import { css, nothing, html } from 'lit';
2
3
  import { classMap } from 'lit/directives/class-map.js';
3
4
  import { ifDefined } from 'lit/directives/if-defined.js';
4
5
  import { live } from 'lit/directives/live.js';
5
6
  import { createRef, ref } from 'lit/directives/ref.js';
6
- import { L as LeuElement } from './LeuElement-BooZrClI.js';
7
+ import { property, state } from 'lit/decorators.js';
8
+ import { L as LeuElement } from './LeuElement-DfsEye-A.js';
7
9
  import { LeuIcon } from './Icon.js';
8
- import './_tslib-CNEFicEt.js';
9
- import 'lit/decorators.js';
10
10
 
11
11
  var css_248z = css`:host {
12
12
  --input-color: var(--leu-color-black-100);
@@ -303,57 +303,45 @@ const VALIDATION_MESSAGES = {
303
303
  /**
304
304
  * A text input element.
305
305
  *
306
- * @prop {boolean} disabled - Disables the input element.
307
- * @prop {boolean} required - Marks the input element as required.
308
- * @prop {boolean} clearable - Adds a button to clear the input element.
309
- * @prop {string} value - The value of the input element.
310
- * @prop {string} name - The name of the input element.
311
- * @prop {string} label - The label of the input element.
312
- * @prop {string} error - A custom error that is completely independent of the validity state. Useful for displaying server side errors.
313
- * @prop {string} size - The size of the input element.
314
- * @prop {string} icon - The icon that is displayed at the end of the input element.
315
- * @prop {string} prefix - A prefix that relates to the value of the input (e.g. CHF).
316
- * @prop {string} suffix - A suffix that relates to the value of the input (e.g. mm).
317
- * @prop {string} pattern - A regular expression that the value is checked against.
318
- * @prop {string} type - The type of the input element.
319
- * @prop {string} min - The minimum value of the input element.
320
- * @prop {string} max - The maximum value of the input element.
321
- * @prop {string} minlength - The minimum length of the input element.
322
- * @prop {string} maxlength - The maximum length of the input element.
323
- * @prop {object} validationMessages - Custom validation messages. The key is the name of the validity state and the value is the message.
324
- * @prop {boolean} novalidate - Disables the browser's validation.
325
- * @prop {string} step - The step value of the input element.
326
- *
327
306
  * @fires {CustomEvent} input - Dispatched when the value of the input element changes.
328
307
  * @fires {CustomEvent} change - Dispatched when the value of the input element changes and the input element loses focus.
329
308
  *
330
309
  * @tagname leu-input
331
310
  */
332
311
  class LeuInput extends LeuElement {
333
- static resolveErrorMessage(message, refernceValue) {
334
- if (typeof message === "function") {
335
- return message(refernceValue);
336
- }
337
- return message;
338
- }
339
312
  constructor() {
340
- super();
313
+ super(...arguments);
314
+ /** Disables the input element. */
341
315
  this.disabled = false;
316
+ /** Marks the input element as required */
342
317
  this.required = false;
318
+ /** Adds a button to clear the input element */
343
319
  this.clearable = false;
344
- /** @type {"small" | "regular"} */
345
- this.size = SIZES.REGULAR;
320
+ /** The value of the input element. */
321
+ this.value = "";
322
+ /** The name of the input element. */
323
+ this.name = "";
324
+ /** A custom error that is completely independent of the validity state. Useful for displaying server side errors. */
325
+ this.error = "";
326
+ /** The label of the input element */
327
+ this.label = "";
328
+ /** The size of the input element */
329
+ this.size = "regular";
330
+ /** The type of the input element. */
346
331
  this.type = "text";
347
- this._validity = null;
332
+ /** Custom validation messages. The key is the name of the validity state and the value is the message. */
348
333
  this.validationMessages = {};
334
+ /** Disables the browser's validation. */
349
335
  this.novalidate = false;
350
- this.value = "";
351
- /**
352
- * @internal
353
- * @type {import("lit/directives/ref.js").Ref<HTMLInputElement>}
354
- */
336
+ this._validity = null;
355
337
  this._inputRef = createRef();
356
338
  }
339
+ static resolveErrorMessage(message, refernceValue) {
340
+ if (typeof message === "function") {
341
+ return message(refernceValue);
342
+ }
343
+ return message;
344
+ }
357
345
  get valueAsNumber() {
358
346
  if (this.value === "") {
359
347
  return NaN;
@@ -367,9 +355,6 @@ class LeuInput extends LeuElement {
367
355
  * looks like the input element. But the actual input field does not
368
356
  * completely fill the wrapper element. Keyboard events don't need to be
369
357
  * handled because the actual input element is focusable.
370
- * @private
371
- * @param {MouseEvent|PointerEvent} event
372
- * @returns {void}
373
358
  */
374
359
  handleWrapperClick(event) {
375
360
  if (event.target === event.currentTarget) {
@@ -379,9 +364,6 @@ class LeuInput extends LeuElement {
379
364
  /**
380
365
  * Method for handling the blur event of the input element.
381
366
  * Checks validity of the input element and sets the validity state.
382
- * @private
383
- * @param {FocusEvent & {target: HTMLInputElement}} event
384
- * @returns {void}
385
367
  */
386
368
  handleBlur(event) {
387
369
  this._validity = null;
@@ -392,9 +374,6 @@ class LeuInput extends LeuElement {
392
374
  /**
393
375
  * Method for handling the invalid event of the input element.
394
376
  * Sets the validity state.
395
- * @private
396
- * @param {Event} event
397
- * @returns {void}
398
377
  */
399
378
  handleInvalid(event) {
400
379
  this._validity = event.target.validity;
@@ -403,10 +382,7 @@ class LeuInput extends LeuElement {
403
382
  * Method for handling the change event of the input element.
404
383
  * Sets the value property and dispatches a change event so that
405
384
  * the event can be handled outside the shadow DOM.
406
- * @private
407
- * @param {Event} event
408
385
  * @fires {CustomEvent} change
409
- * @returns {void}
410
386
  */
411
387
  handleChange(event) {
412
388
  if (event.target.validity.valid) {
@@ -419,9 +395,6 @@ class LeuInput extends LeuElement {
419
395
  * Method for handling the input event of the input element.
420
396
  * Sets the value property and dispatches an input event so that
421
397
  * the event can be handled outside the shadow DOM.
422
- * @private
423
- * @param {Event} event
424
- * @returns {void}
425
398
  */
426
399
  handleInput(event) {
427
400
  this.value = event.target.value;
@@ -435,8 +408,6 @@ class LeuInput extends LeuElement {
435
408
  * Method for clearing the input element.
436
409
  * Sets the value property to an empty string and dispatches
437
410
  * an input and a change event.
438
- * @private
439
- * @returns {void}
440
411
  * @fires {CustomEvent} input
441
412
  * @fires {CustomEvent} change
442
413
  */
@@ -454,8 +425,6 @@ class LeuInput extends LeuElement {
454
425
  * e.g.
455
426
  * `tooLong(this.maxlength)`
456
427
  * This way the framework user can create reasonable validation messages
457
- *
458
- * @returns {Object} validationMessages
459
428
  */
460
429
  getValidationMessages() {
461
430
  const validationMessages = {
@@ -479,14 +448,12 @@ class LeuInput extends LeuElement {
479
448
  }
480
449
  /**
481
450
  * Check input validation
482
- * @returns {boolean} if valid or not
483
451
  */
484
452
  checkValidity() {
485
453
  return this._inputRef.value?.checkValidity() ?? false;
486
454
  }
487
455
  /**
488
456
  * Creates an error list with an item for the given validity state.
489
- * @returns {import("lit").TemplateResult | nothing}
490
457
  */
491
458
  renderErrorMessages() {
492
459
  if (!this.isInvalid()) {
@@ -495,7 +462,7 @@ class LeuInput extends LeuElement {
495
462
  const validationMessages = this.getValidationMessages();
496
463
  let errorMessages = this._validity
497
464
  ? Object.entries(validationMessages)
498
- .filter(([property]) => this._validity[property])
465
+ .filter(([prop]) => this._validity[prop])
499
466
  .map(([_, message]) => message)
500
467
  : [];
501
468
  if (this.error !== "") {
@@ -510,9 +477,6 @@ class LeuInput extends LeuElement {
510
477
  /**
511
478
  * Determines the content that is displayed after the input element.
512
479
  * This can be either an icon, a clear button or an error indicator icon.
513
- *
514
- * @private
515
- * @returns {import("lit").TemplateResult | nothing}
516
480
  */
517
481
  renderAfterContent() {
518
482
  if (this.isInvalid()) {
@@ -596,29 +560,68 @@ LeuInput.shadowRootOptions = {
596
560
  ...LeuElement.shadowRootOptions,
597
561
  delegatesFocus: true,
598
562
  };
599
- LeuInput.properties = {
600
- disabled: { type: Boolean, reflect: true },
601
- required: { type: Boolean, reflect: true },
602
- clearable: { type: Boolean, reflect: true },
603
- value: { type: String, reflect: true },
604
- name: { type: String, reflect: true },
605
- error: { type: String, reflect: true },
606
- label: { type: String, reflect: true },
607
- prefix: { type: String, reflect: true },
608
- suffix: { type: String, reflect: true },
609
- size: { type: String, reflect: true },
610
- icon: { type: String, reflect: true },
611
- /* Validation attributes */
612
- pattern: { type: String, reflect: true },
613
- type: { type: String, reflect: true },
614
- min: { type: String, reflect: true },
615
- max: { type: String, reflect: true },
616
- maxlength: { type: String, reflect: true },
617
- minlength: { type: String, reflect: true },
618
- validationMessages: { type: Object },
619
- novalidate: { type: Boolean, reflect: true },
620
- step: { type: String, reflect: true },
621
- _validity: { state: true },
622
- };
563
+ __decorate([
564
+ property({ type: Boolean, reflect: true })
565
+ ], LeuInput.prototype, "disabled", void 0);
566
+ __decorate([
567
+ property({ type: Boolean, reflect: true })
568
+ ], LeuInput.prototype, "required", void 0);
569
+ __decorate([
570
+ property({ type: Boolean, reflect: true })
571
+ ], LeuInput.prototype, "clearable", void 0);
572
+ __decorate([
573
+ property({ type: String, reflect: true })
574
+ ], LeuInput.prototype, "value", void 0);
575
+ __decorate([
576
+ property({ type: String, reflect: true })
577
+ ], LeuInput.prototype, "name", void 0);
578
+ __decorate([
579
+ property({ type: String, reflect: true })
580
+ ], LeuInput.prototype, "error", void 0);
581
+ __decorate([
582
+ property({ type: String, reflect: true })
583
+ ], LeuInput.prototype, "label", void 0);
584
+ __decorate([
585
+ property({ type: String, reflect: true })
586
+ ], LeuInput.prototype, "prefix", void 0);
587
+ __decorate([
588
+ property({ type: String, reflect: true })
589
+ ], LeuInput.prototype, "suffix", void 0);
590
+ __decorate([
591
+ property({ type: String, reflect: true })
592
+ ], LeuInput.prototype, "size", void 0);
593
+ __decorate([
594
+ property({ type: String, reflect: true })
595
+ ], LeuInput.prototype, "icon", void 0);
596
+ __decorate([
597
+ property({ type: String, reflect: true })
598
+ ], LeuInput.prototype, "pattern", void 0);
599
+ __decorate([
600
+ property({ type: String, reflect: true })
601
+ ], LeuInput.prototype, "type", void 0);
602
+ __decorate([
603
+ property({ type: Number, reflect: true })
604
+ ], LeuInput.prototype, "min", void 0);
605
+ __decorate([
606
+ property({ type: Number, reflect: true })
607
+ ], LeuInput.prototype, "max", void 0);
608
+ __decorate([
609
+ property({ type: Number, reflect: true })
610
+ ], LeuInput.prototype, "step", void 0);
611
+ __decorate([
612
+ property({ type: Number, reflect: true })
613
+ ], LeuInput.prototype, "maxlength", void 0);
614
+ __decorate([
615
+ property({ type: Number, reflect: true })
616
+ ], LeuInput.prototype, "minlength", void 0);
617
+ __decorate([
618
+ property({ type: Object })
619
+ ], LeuInput.prototype, "validationMessages", void 0);
620
+ __decorate([
621
+ property({ type: Boolean, reflect: true })
622
+ ], LeuInput.prototype, "novalidate", void 0);
623
+ __decorate([
624
+ state()
625
+ ], LeuInput.prototype, "_validity", void 0);
623
626
 
624
627
  export { LeuInput, SIZES };
@@ -35,7 +35,7 @@ class LeuElement extends LitElement {
35
35
  }
36
36
  }
37
37
  }
38
- LeuElement.version = "0.22.0";
38
+ LeuElement.version = "0.22.1";
39
39
  LeuElement.dependencies = {};
40
40
  LeuElement.styles = css_248z;
41
41
 
package/dist/Menu.d.ts CHANGED
@@ -3,7 +3,7 @@ import * as lit from 'lit';
3
3
  import { PropertyValues } from 'lit';
4
4
  import { L as LeuElement } from './LeuElement.d-BevHqLUu.js';
5
5
  import { LeuMenuItem } from './MenuItem.js';
6
- import './Icon.js';
6
+ import './Icon.d-itcQ94ym.js';
7
7
 
8
8
  /**
9
9
  * @typedef {'single' | 'multiple' | 'none'} SelectsType
@@ -22,13 +22,7 @@ declare class LeuMenu extends LeuElement {
22
22
  customElements?: CustomElementRegistry;
23
23
  registry?: CustomElementRegistry;
24
24
  };
25
- static properties: {
26
- selects: {
27
- type: StringConstructor;
28
- reflect: boolean;
29
- };
30
- };
31
- constructor();
25
+ selects: "single" | "multiple" | "none";
32
26
  connectedCallback(): void;
33
27
  disconnectedCallback(): void;
34
28
  _handleSlotChange(): void;
package/dist/Menu.js CHANGED
@@ -1,10 +1,10 @@
1
+ import { _ as __decorate } from './_tslib-CNEFicEt.js';
1
2
  import { css, html } from 'lit';
2
- import { L as LeuElement } from './LeuElement-BooZrClI.js';
3
+ import { property } from 'lit/decorators.js';
4
+ import { L as LeuElement } from './LeuElement-DfsEye-A.js';
3
5
  import { LeuMenuItem } from './MenuItem.js';
4
6
  import 'lit/directives/if-defined.js';
5
7
  import './Icon.js';
6
- import './_tslib-CNEFicEt.js';
7
- import 'lit/decorators.js';
8
8
 
9
9
  var css_248z = css`:host {
10
10
  --menu-divider-color: var(--leu-color-black-transp-20);
@@ -37,10 +37,8 @@ var css_248z = css`:host {
37
37
  */
38
38
  class LeuMenu extends LeuElement {
39
39
  constructor() {
40
- super();
41
- /** @type {SelectsType} */
40
+ super(...arguments);
42
41
  this.selects = "none";
43
- this.value = undefined;
44
42
  }
45
43
  connectedCallback() {
46
44
  super.connectedCallback();
@@ -153,8 +151,8 @@ LeuMenu.shadowRootOptions = {
153
151
  ...LeuElement.shadowRootOptions,
154
152
  delegatesFocus: true,
155
153
  };
156
- LeuMenu.properties = {
157
- selects: { type: String, reflect: true },
158
- };
154
+ __decorate([
155
+ property({ type: String, reflect: true })
156
+ ], LeuMenu.prototype, "selects", void 0);
159
157
 
160
158
  export { LeuMenu };
@@ -1,22 +1,13 @@
1
- import * as lit_html from 'lit-html';
2
1
  import * as lit from 'lit';
3
- import { nothing } from 'lit';
2
+ import { TemplateResult, nothing } from 'lit';
4
3
  import { L as LeuElement } from './LeuElement.d-BevHqLUu.js';
5
- import { LeuIcon } from './Icon.js';
4
+ import { L as LeuIcon } from './Icon.d-itcQ94ym.js';
5
+ import 'lit-html';
6
6
 
7
- /**
8
- * @typedef {'menuitem' | 'menuitemcheckbox' | 'menuitemradio' | 'option' | 'none'} MenuItemRole
9
- */
7
+ type MenuItemRole = "menuitem" | "menuitemcheckbox" | "menuitemradio" | "option" | "none";
10
8
  /**
11
9
  * @tagname leu-menu-item
12
10
  * @slot - The label of the menu item
13
- * @property {boolean} active - Defines if the item is selected or checked
14
- * @property {boolean} multipleSelection - If the item is part of a multiple selection. Renders a checkmark before the label when active
15
- * @property {boolean} disabled - Disables the underlying button or link
16
- * @property {string} value - The value of the item. It must not contain commas. See `getValue()`
17
- * @property {string} href - The href of the underlying link
18
- * @property {boolean} tabbable - If the item should be focusable. Will be reflected as `tabindex` to the underlying button or link
19
- * @property {MenuItemRole} componentRole - The role of the item. This will be reflected as `role` to the underlying button or link. Default is `'menuitem'.`
20
11
  */
21
12
  declare class LeuMenuItem extends LeuElement {
22
13
  static dependencies: {
@@ -34,59 +25,40 @@ declare class LeuMenuItem extends LeuElement {
34
25
  customElements?: CustomElementRegistry;
35
26
  registry?: CustomElementRegistry;
36
27
  };
37
- static properties: {
38
- active: {
39
- type: BooleanConstructor;
40
- reflect: boolean;
41
- };
42
- multipleSelection: {
43
- type: BooleanConstructor;
44
- reflect: boolean;
45
- attr: string;
46
- };
47
- disabled: {
48
- type: BooleanConstructor;
49
- reflect: boolean;
50
- };
51
- tabbable: {
52
- type: BooleanConstructor;
53
- reflect: boolean;
54
- };
55
- href: {
56
- type: StringConstructor;
57
- reflect: boolean;
58
- };
59
- value: {
60
- type: StringConstructor;
61
- reflect: boolean;
62
- };
63
- componentRole: {
64
- type: StringConstructor;
65
- reflect: boolean;
66
- };
67
- };
68
- constructor();
28
+ /** Defines if the item is selected or checked */
29
+ active: boolean;
30
+ /** If the item is part of a multiple selection. Renders a checkmark before the label when active */
31
+ multipleSelection: boolean;
32
+ /** Disables the underlying button or link */
33
+ disabled: boolean;
34
+ /** If the item should be focusable. Will be reflected as `tabindex` to the underlying button or link */
35
+ tabbable: boolean;
36
+ /** The href of the underlying link */
37
+ href: string;
38
+ /** The value of the item. It must not contain commas. See `getValue()` */
39
+ value: string;
40
+ /** The role of the item. This will be reflected as `role` to the underlying button or link. Default is `'menuitem'.` */
41
+ componentRole: MenuItemRole;
69
42
  connectedCallback(): void;
70
43
  disconnectedCallback(): void;
71
- _handleClick(event: any): void;
44
+ protected _handleClick(event: MouseEvent): void;
72
45
  /**
73
46
  * Returns the value of the item. If `value` is not set, it will return the inner text
74
- * @returns {string}
75
47
  */
76
- getValue(): any;
77
- _getAria(): {
78
- disabled: any;
48
+ getValue(): string;
49
+ protected _getAria(): {
50
+ disabled: boolean;
79
51
  } | {
80
- checked: any;
81
- selected: any;
82
- role: any;
83
- disabled: any;
52
+ checked: boolean;
53
+ selected: boolean;
54
+ role: "option" | "menuitem" | "menuitemcheckbox" | "menuitemradio";
55
+ disabled: boolean;
84
56
  };
85
- _getTabIndex(): 0 | -1;
86
- _renderLink(content: any): lit_html.TemplateResult<1>;
87
- _renderButton(content: any): lit_html.TemplateResult<1>;
88
- _renderBeforeSlotDefault(): typeof nothing | lit_html.TemplateResult<1>;
89
- render(): lit_html.TemplateResult<1>;
57
+ protected _getTabIndex(): 0 | -1;
58
+ protected _renderLink(content: TemplateResult): TemplateResult<1>;
59
+ protected _renderButton(content: TemplateResult): TemplateResult<1>;
60
+ _renderBeforeSlotDefault(): typeof nothing | TemplateResult<1>;
61
+ render(): TemplateResult<1>;
90
62
  }
91
63
 
92
64
  export { LeuMenuItem };
package/dist/MenuItem.js CHANGED
@@ -1,9 +1,9 @@
1
+ import { _ as __decorate } from './_tslib-CNEFicEt.js';
1
2
  import { css, html, nothing } from 'lit';
2
3
  import { ifDefined } from 'lit/directives/if-defined.js';
3
- import { L as LeuElement } from './LeuElement-BooZrClI.js';
4
+ import { property } from 'lit/decorators.js';
5
+ import { L as LeuElement } from './LeuElement-DfsEye-A.js';
4
6
  import { LeuIcon } from './Icon.js';
5
- import './_tslib-CNEFicEt.js';
6
- import 'lit/decorators.js';
7
7
 
8
8
  var css_248z = css`:host {
9
9
  --background: var(--leu-color-black-0);
@@ -88,30 +88,20 @@ var css_248z = css`:host {
88
88
  }
89
89
  `;
90
90
 
91
- /**
92
- * @typedef {'menuitem' | 'menuitemcheckbox' | 'menuitemradio' | 'option' | 'none'} MenuItemRole
93
- */
94
91
  /**
95
92
  * @tagname leu-menu-item
96
93
  * @slot - The label of the menu item
97
- * @property {boolean} active - Defines if the item is selected or checked
98
- * @property {boolean} multipleSelection - If the item is part of a multiple selection. Renders a checkmark before the label when active
99
- * @property {boolean} disabled - Disables the underlying button or link
100
- * @property {string} value - The value of the item. It must not contain commas. See `getValue()`
101
- * @property {string} href - The href of the underlying link
102
- * @property {boolean} tabbable - If the item should be focusable. Will be reflected as `tabindex` to the underlying button or link
103
- * @property {MenuItemRole} componentRole - The role of the item. This will be reflected as `role` to the underlying button or link. Default is `'menuitem'.`
104
94
  */
105
95
  class LeuMenuItem extends LeuElement {
106
96
  constructor() {
107
- super();
97
+ super(...arguments);
98
+ /** Defines if the item is selected or checked */
108
99
  this.active = false;
109
- this.disabled = false;
100
+ /** If the item is part of a multiple selection. Renders a checkmark before the label when active */
110
101
  this.multipleSelection = false;
111
- this.value = undefined;
112
- this.href = undefined;
113
- this.tabbable = undefined;
114
- /** @type {MenuItemRole} */
102
+ /** Disables the underlying button or link */
103
+ this.disabled = false;
104
+ /** The role of the item. This will be reflected as `role` to the underlying button or link. Default is `'menuitem'.` */
115
105
  this.componentRole = "menuitem";
116
106
  }
117
107
  connectedCallback() {
@@ -130,7 +120,6 @@ class LeuMenuItem extends LeuElement {
130
120
  }
131
121
  /**
132
122
  * Returns the value of the item. If `value` is not set, it will return the inner text
133
- * @returns {string}
134
123
  */
135
124
  getValue() {
136
125
  return this.value || this.textContent.trim();
@@ -214,18 +203,26 @@ LeuMenuItem.shadowRootOptions = {
214
203
  ...LeuElement.shadowRootOptions,
215
204
  delegatesFocus: true,
216
205
  };
217
- LeuMenuItem.properties = {
218
- active: { type: Boolean, reflect: true },
219
- multipleSelection: {
220
- type: Boolean,
221
- reflect: true,
222
- attr: "multiple-selection",
223
- },
224
- disabled: { type: Boolean, reflect: true },
225
- tabbable: { type: Boolean, reflect: true },
226
- href: { type: String, reflect: true },
227
- value: { type: String, reflect: true },
228
- componentRole: { type: String, reflect: true },
229
- };
206
+ __decorate([
207
+ property({ type: Boolean, reflect: true })
208
+ ], LeuMenuItem.prototype, "active", void 0);
209
+ __decorate([
210
+ property({ type: Boolean, reflect: true })
211
+ ], LeuMenuItem.prototype, "multipleSelection", void 0);
212
+ __decorate([
213
+ property({ type: Boolean, reflect: true })
214
+ ], LeuMenuItem.prototype, "disabled", void 0);
215
+ __decorate([
216
+ property({ type: Boolean, reflect: true })
217
+ ], LeuMenuItem.prototype, "tabbable", void 0);
218
+ __decorate([
219
+ property({ type: String, reflect: true })
220
+ ], LeuMenuItem.prototype, "href", void 0);
221
+ __decorate([
222
+ property({ type: String, reflect: true })
223
+ ], LeuMenuItem.prototype, "value", void 0);
224
+ __decorate([
225
+ property({ type: String, reflect: true })
226
+ ], LeuMenuItem.prototype, "componentRole", void 0);
230
227
 
231
228
  export { LeuMenuItem };
package/dist/Message.d.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  import * as lit_html from 'lit-html';
2
2
  import * as lit from 'lit';
3
3
  import { L as LeuElement } from './LeuElement.d-BevHqLUu.js';
4
- import { LeuIcon } from './Icon.js';
4
+ import { L as LeuIcon } from './Icon.d-itcQ94ym.js';
5
5
 
6
6
  /**
7
7
  * @tagname leu-message
package/dist/Message.js CHANGED
@@ -2,7 +2,7 @@ import { _ as __decorate } from './_tslib-CNEFicEt.js';
2
2
  import { css, html, nothing } from 'lit';
3
3
  import { property } from 'lit/decorators.js';
4
4
  import { classMap } from 'lit/directives/class-map.js';
5
- import { L as LeuElement } from './LeuElement-BooZrClI.js';
5
+ import { L as LeuElement } from './LeuElement-DfsEye-A.js';
6
6
  import { LeuIcon } from './Icon.js';
7
7
  import { H as HasSlotController } from './hasSlotController-Bm2tipvG.js';
8
8
 
@@ -3,7 +3,7 @@ import * as lit from 'lit';
3
3
  import { L as LeuElement } from './LeuElement.d-BevHqLUu.js';
4
4
  import { LeuButton } from './Button.js';
5
5
  import { LeuVisuallyHidden } from './VisuallyHidden.js';
6
- import { LeuIcon } from './Icon.js';
6
+ import { L as LeuIcon } from './Icon.d-itcQ94ym.js';
7
7
 
8
8
  /**
9
9
  * @tagname leu-pagination
@@ -2,7 +2,7 @@ import { _ as __decorate } from './_tslib-CNEFicEt.js';
2
2
  import { css, html } from 'lit';
3
3
  import { live } from 'lit/directives/live.js';
4
4
  import { property, state } from 'lit/decorators.js';
5
- import { L as LeuElement } from './LeuElement-BooZrClI.js';
5
+ import { L as LeuElement } from './LeuElement-DfsEye-A.js';
6
6
  import { LeuButton } from './Button.js';
7
7
  import { LeuVisuallyHidden } from './VisuallyHidden.js';
8
8
  import { LeuIcon } from './Icon.js';
@@ -1,5 +1,5 @@
1
1
  import { css, html } from 'lit';
2
- import { L as LeuElement } from './LeuElement-BooZrClI.js';
2
+ import { L as LeuElement } from './LeuElement-DfsEye-A.js';
3
3
 
4
4
  var css_248z = css`:host {
5
5
  --placeholder-font-regular: var(--leu-font-family-regular);
package/dist/Popup.js CHANGED
@@ -2,7 +2,7 @@ import { _ as __decorate } from './_tslib-CNEFicEt.js';
2
2
  import { css, html } from 'lit';
3
3
  import { property } from 'lit/decorators.js';
4
4
  import { autoUpdate, size, flip, shift, computePosition } from '@floating-ui/dom';
5
- import { L as LeuElement } from './LeuElement-BooZrClI.js';
5
+ import { L as LeuElement } from './LeuElement-DfsEye-A.js';
6
6
 
7
7
  var css_248z = css`:host {
8
8
  --popup-font-regular: var(--leu-font-family-regular);
@@ -2,7 +2,7 @@ import { _ as __decorate } from './_tslib-CNEFicEt.js';
2
2
  import { css, nothing, html } from 'lit';
3
3
  import { ifDefined } from 'lit/directives/if-defined.js';
4
4
  import { property } from 'lit/decorators.js';
5
- import { L as LeuElement } from './LeuElement-BooZrClI.js';
5
+ import { L as LeuElement } from './LeuElement-DfsEye-A.js';
6
6
 
7
7
  var css_248z = css`/* :host {
8
8
  --progress-bar-font-regular: var(--leu-font-family-regular);
package/dist/Radio.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import { _ as __decorate } from './_tslib-CNEFicEt.js';
2
2
  import { css, html } from 'lit';
3
3
  import { property } from 'lit/decorators.js';
4
- import { L as LeuElement } from './LeuElement-BooZrClI.js';
4
+ import { L as LeuElement } from './LeuElement-DfsEye-A.js';
5
5
 
6
6
  var css_248z = css`:host {
7
7
  --radio-color: var(--leu-color-black-40);
@@ -2,7 +2,7 @@ import { _ as __decorate } from './_tslib-CNEFicEt.js';
2
2
  import { css, html } from 'lit';
3
3
  import { classMap } from 'lit/directives/class-map.js';
4
4
  import { property } from 'lit/decorators.js';
5
- import { L as LeuElement } from './LeuElement-BooZrClI.js';
5
+ import { L as LeuElement } from './LeuElement-DfsEye-A.js';
6
6
  import { LeuRadio } from './Radio.js';
7
7
 
8
8
  var css_248z = css`:host {