@scania/tegel 1.37.0 → 1.37.1-dropdown-prevent-internal-reset-beta.0

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 (100) hide show
  1. package/dist/cjs/tds-breadcrumbs.cjs.entry.js +1 -6
  2. package/dist/cjs/tds-button.cjs.entry.js +3 -8
  3. package/dist/cjs/tds-checkbox.cjs.entry.js +2 -7
  4. package/dist/cjs/tds-chip.cjs.entry.js +1 -6
  5. package/dist/cjs/tds-datetime.cjs.entry.js +3 -8
  6. package/dist/cjs/tds-dropdown_2.cjs.entry.js +8 -19
  7. package/dist/cjs/tds-header-dropdown.cjs.entry.js +3 -10
  8. package/dist/cjs/tds-header-hamburger.cjs.entry.js +1 -6
  9. package/dist/cjs/tds-header-launcher.cjs.entry.js +2 -7
  10. package/dist/cjs/tds-table-body-row.cjs.entry.js +1 -1
  11. package/dist/cjs/tds-text-field.cjs.entry.js +5 -10
  12. package/dist/cjs/tds-textarea.cjs.entry.js +3 -8
  13. package/dist/cjs/tds-toggle.cjs.entry.js +4 -7
  14. package/dist/collection/components/breadcrumbs/breadcrumbs.js +1 -6
  15. package/dist/collection/components/button/button.js +3 -8
  16. package/dist/collection/components/checkbox/checkbox.js +2 -7
  17. package/dist/collection/components/chip/chip.js +1 -6
  18. package/dist/collection/components/datetime/datetime.js +3 -8
  19. package/dist/collection/components/dropdown/dropdown-option/dropdown-option.js +1 -6
  20. package/dist/collection/components/dropdown/dropdown.js +7 -13
  21. package/dist/collection/components/header/header-dropdown/header-dropdown.js +3 -10
  22. package/dist/collection/components/header/header-hamburger/header-hamburger.js +1 -6
  23. package/dist/collection/components/header/header-launcher/header-launcher.js +2 -7
  24. package/dist/collection/components/table/table-body-row/table-body-row.css +4 -0
  25. package/dist/collection/components/text-field/text-field.js +5 -10
  26. package/dist/collection/components/textarea/textarea.js +3 -8
  27. package/dist/collection/components/toggle/toggle.js +4 -7
  28. package/dist/components/{p-23aab3b9.js → p-44f5b5e1.js} +2 -7
  29. package/dist/components/{p-ffbaebb1.js → p-c0066f2a.js} +7 -13
  30. package/dist/components/{p-19edd11a.js → p-d64878cb.js} +2 -7
  31. package/dist/components/tds-breadcrumbs.js +1 -6
  32. package/dist/components/tds-button.js +3 -8
  33. package/dist/components/tds-checkbox.js +1 -1
  34. package/dist/components/tds-chip.js +1 -6
  35. package/dist/components/tds-datetime.js +3 -8
  36. package/dist/components/tds-dropdown-option.js +1 -1
  37. package/dist/components/tds-dropdown.js +1 -1
  38. package/dist/components/tds-header-dropdown.js +3 -10
  39. package/dist/components/tds-header-hamburger.js +1 -6
  40. package/dist/components/tds-header-launcher.js +2 -7
  41. package/dist/components/tds-table-body-row.js +2 -2
  42. package/dist/components/tds-table-footer.js +3 -3
  43. package/dist/components/tds-table-header.js +1 -1
  44. package/dist/components/tds-text-field.js +5 -10
  45. package/dist/components/tds-textarea.js +3 -8
  46. package/dist/components/tds-toggle.js +4 -7
  47. package/dist/esm/tds-breadcrumbs.entry.js +1 -6
  48. package/dist/esm/tds-button.entry.js +3 -8
  49. package/dist/esm/tds-checkbox.entry.js +2 -7
  50. package/dist/esm/tds-chip.entry.js +1 -6
  51. package/dist/esm/tds-datetime.entry.js +3 -8
  52. package/dist/esm/tds-dropdown_2.entry.js +8 -19
  53. package/dist/esm/tds-header-dropdown.entry.js +3 -10
  54. package/dist/esm/tds-header-hamburger.entry.js +1 -6
  55. package/dist/esm/tds-header-launcher.entry.js +2 -7
  56. package/dist/esm/tds-table-body-row.entry.js +1 -1
  57. package/dist/esm/tds-text-field.entry.js +5 -10
  58. package/dist/esm/tds-textarea.entry.js +3 -8
  59. package/dist/esm/tds-toggle.entry.js +4 -7
  60. package/dist/tegel/p-1b471db7.entry.js +1 -0
  61. package/dist/tegel/p-2fcd8108.entry.js +1 -0
  62. package/dist/tegel/p-3022d31d.entry.js +1 -0
  63. package/dist/tegel/p-303acf88.entry.js +1 -0
  64. package/dist/tegel/p-3ebe93ff.entry.js +1 -0
  65. package/dist/tegel/p-8c2695af.entry.js +1 -0
  66. package/dist/tegel/p-9b0c886e.entry.js +1 -0
  67. package/dist/tegel/p-a6238890.entry.js +1 -0
  68. package/dist/tegel/p-a74cb560.entry.js +1 -0
  69. package/dist/tegel/p-a98767ea.entry.js +1 -0
  70. package/dist/tegel/p-cd5103e3.entry.js +1 -0
  71. package/dist/tegel/{p-614cc097.entry.js → p-d0f09796.entry.js} +1 -1
  72. package/dist/tegel/p-f9c17612.entry.js +1 -0
  73. package/dist/tegel/tegel.css +3 -3
  74. package/dist/tegel/tegel.esm.js +1 -1
  75. package/dist/types/components/breadcrumbs/breadcrumbs.d.ts +0 -1
  76. package/dist/types/components/button/button.d.ts +0 -1
  77. package/dist/types/components/checkbox/checkbox.d.ts +0 -1
  78. package/dist/types/components/chip/chip.d.ts +0 -1
  79. package/dist/types/components/datetime/datetime.d.ts +0 -1
  80. package/dist/types/components/dropdown/dropdown-option/dropdown-option.d.ts +0 -1
  81. package/dist/types/components/dropdown/dropdown.d.ts +0 -1
  82. package/dist/types/components/header/header-dropdown/header-dropdown.d.ts +0 -1
  83. package/dist/types/components/header/header-hamburger/header-hamburger.d.ts +0 -1
  84. package/dist/types/components/header/header-launcher/header-launcher.d.ts +0 -1
  85. package/dist/types/components/text-field/text-field.d.ts +0 -1
  86. package/dist/types/components/textarea/textarea.d.ts +0 -1
  87. package/dist/types/components/toggle/toggle.d.ts +0 -1
  88. package/package.json +1 -1
  89. package/dist/tegel/p-23ea1922.entry.js +0 -1
  90. package/dist/tegel/p-2c56421f.entry.js +0 -1
  91. package/dist/tegel/p-5020a688.entry.js +0 -1
  92. package/dist/tegel/p-569d5de4.entry.js +0 -1
  93. package/dist/tegel/p-618d6b4f.entry.js +0 -1
  94. package/dist/tegel/p-83831252.entry.js +0 -1
  95. package/dist/tegel/p-9fe97da7.entry.js +0 -1
  96. package/dist/tegel/p-ab103d0c.entry.js +0 -1
  97. package/dist/tegel/p-b58194f9.entry.js +0 -1
  98. package/dist/tegel/p-e00c0c30.entry.js +0 -1
  99. package/dist/tegel/p-f68530b3.entry.js +0 -1
  100. package/dist/tegel/p-f9374451.entry.js +0 -1
@@ -80,13 +80,8 @@ export class TdsDropdownOption {
80
80
  componentWillLoad() {
81
81
  this.internalValue = convertToString(this.value);
82
82
  }
83
- connectedCallback() {
84
- if (!this.tdsAriaLabel && !this.multiselect) {
85
- console.warn('Tegel Dropdown option component: tdsAriaLabel prop is missing');
86
- }
87
- }
88
83
  render() {
89
- return (h(Host, { key: '52827112a3060a8858978c3e65c284358f923539' }, h("div", { key: 'edf5262e5dbbfadf34ff6faa164e58b7fec1e561', class: `dropdown-option
84
+ return (h(Host, { key: 'd35a3153be292b1656d0efca93f06bfc1357041b' }, h("div", { key: '384353f9868a3fb559ca4140d5cd4f5553e024ad', class: `dropdown-option
90
85
  ${this.size}
91
86
  ${this.selected ? 'selected' : ''}
92
87
  ${this.disabled ? 'disabled' : ''}
@@ -121,12 +121,11 @@ export class TdsDropdown {
121
121
  }
122
122
  };
123
123
  this.handleFilterReset = () => {
124
- this.reset();
124
+ // Only clear the input text and filter, don't reset the selected option
125
125
  this.inputElement.value = '';
126
126
  this.handleFilter({ target: { value: '' } });
127
127
  this.inputElement.focus();
128
- // Add this line to ensure internal value is cleared
129
- this.internalValue = '';
128
+ // Don't clear internalValue or call reset() - preserve the selected option
130
129
  };
131
130
  this.handleFocus = (event) => {
132
131
  this.open = true;
@@ -441,11 +440,6 @@ export class TdsDropdown {
441
440
  form.removeEventListener('reset', this.resetInput);
442
441
  }
443
442
  }
444
- connectedCallback() {
445
- if (!this.tdsAriaLabel) {
446
- console.warn('Tegel Dropdown component: tdsAriaLabel prop is missing');
447
- }
448
- }
449
443
  updateDropdownListInertState() {
450
444
  if (this.dropdownList) {
451
445
  if (this.open) {
@@ -461,9 +455,9 @@ export class TdsDropdown {
461
455
  // Generate unique IDs for associating labels and helpers with the input/button
462
456
  const labelId = this.label ? `dropdown-label-${this.name || generateUniqueId()}` : undefined;
463
457
  const helperId = this.helper ? `dropdown-helper-${this.name || generateUniqueId()}` : undefined;
464
- return (h(Host, { key: '676f9d61c5fd8488cedbc949757e992be13e49eb', class: {
458
+ return (h(Host, { key: 'c3d90008af3a9376540a5058b64349ec3235acb0', class: {
465
459
  [`tds-mode-variant-${this.modeVariant}`]: Boolean(this.modeVariant),
466
- } }, this.label && this.labelPosition === 'outside' && (h("div", { key: 'ac4f3c9ca2719acc72f06ae977bf032d05913c6d', id: labelId, class: `label-outside ${this.disabled ? 'disabled' : ''}` }, this.label)), h("div", { key: 'c9d4142f63e315c73daef5038f266a32b05559a1', class: {
460
+ } }, this.label && this.labelPosition === 'outside' && (h("div", { key: 'fc60cdf4d107cf74d07d0df1582dc8bc14020b08', id: labelId, class: `label-outside ${this.disabled ? 'disabled' : ''}` }, this.label)), h("div", { key: '0cddc37f241453e5c8d80292b50865c8274fc70c', class: {
467
461
  'dropdown-select': true,
468
462
  [this.size]: true,
469
463
  'disabled': this.disabled,
@@ -513,7 +507,7 @@ export class TdsDropdown {
513
507
  label-inside-as-placeholder
514
508
  ${this.size}
515
509
  ${this.selectedOptions.length ? 'selected' : ''}
516
- ` }, this.label)), h("div", { class: `placeholder ${this.size}` }, this.selectedOptions.length ? this.getValue() : this.placeholder), h("tds-icon", { "aria-label": "Open/Close dropdown", svgTitle: "Open/Close dropdown", class: `menu-icon ${this.open ? 'open' : 'closed'}`, name: "chevron_down", size: "16px" }))))), h("div", { key: '6de931198040eec79815f83e2617d2646507b6a1', role: "listbox", "aria-label": this.tdsAriaLabel, inert: !this.open, "aria-orientation": "vertical", "aria-multiselectable": this.multiselect, ref: (element) => {
510
+ ` }, this.label)), h("div", { class: `placeholder ${this.size}` }, this.selectedOptions.length ? this.getValue() : this.placeholder), h("tds-icon", { "aria-label": "Open/Close dropdown", svgTitle: "Open/Close dropdown", class: `menu-icon ${this.open ? 'open' : 'closed'}`, name: "chevron_down", size: "16px" }))))), h("div", { key: '107220cfc03a19eb3735b2f33b1af145b4f51094', role: "listbox", "aria-label": this.tdsAriaLabel, inert: !this.open, "aria-orientation": "vertical", "aria-multiselectable": this.multiselect, ref: (element) => {
517
511
  this.dropdownList = element;
518
512
  }, class: {
519
513
  'dropdown-list': true,
@@ -524,11 +518,11 @@ export class TdsDropdown {
524
518
  'closed': !this.open,
525
519
  [`animation-enter-${this.animation}`]: this.animation !== 'none' && this.open,
526
520
  [`animation-exit-${this.animation}`]: this.animation !== 'none' && !this.open,
527
- } }, h("slot", { key: '61ab9737181371073b25b95c34dad3311c2995c0', onSlotchange: () => this.handleSlotChange() }), this.filterResult === 0 && this.noResultText !== '' && (h("div", { key: 'aca39f881a57a6a23de03da78b5062e5dff55af7', class: `no-result ${this.size}` }, this.noResultText))), this.helper && (h("div", { key: '1e4221e58bc16608bfb0f780b7bc8040935eab37', id: helperId, class: {
521
+ } }, h("slot", { key: 'fb2baca104f77a24fed845719131d1d7b73e8226', onSlotchange: () => this.handleSlotChange() }), this.filterResult === 0 && this.noResultText !== '' && (h("div", { key: 'e34ef314336b3537e2735d832367ee364ec0102c', class: `no-result ${this.size}` }, this.noResultText))), this.helper && (h("div", { key: '2c28f6d1178f58f2526fc6e56a734b29eed17a49', id: helperId, class: {
528
522
  helper: true,
529
523
  error: this.error,
530
524
  disabled: this.disabled,
531
- } }, this.error && h("tds-icon", { key: 'ec946e77add75e7eaf194e2b38e5dd1c548ab32f', name: "error", size: "16px" }), this.helper))));
525
+ } }, this.error && h("tds-icon", { key: '23234ccade4136e2240f87edf5adf36d1fc32b8a', name: "error", size: "16px" }), this.helper))));
532
526
  }
533
527
  static get is() { return "tds-dropdown"; }
534
528
  static get encapsulation() { return "shadow"; }
@@ -1,6 +1,5 @@
1
1
  import { h, Host } from "@stencil/core";
2
2
  import generateUniqueId from "../../../utils/generateUniqueId";
3
- import hasSlot from "../../../utils/hasSlot";
4
3
  /**
5
4
  * @slot <default> - <b>Unnamed slot.</b> For injecting a dropdown list.
6
5
  * @slot icon - Slot for an Icon in the dropdown button.
@@ -47,20 +46,14 @@ export class TdsHeaderDropdown {
47
46
  });
48
47
  }
49
48
  }
50
- connectedCallback() {
51
- const hasLabelSlot = hasSlot('label', this.host);
52
- if (!this.tdsAriaLabel && !hasLabelSlot) {
53
- console.warn('Tegel Header Dropdown component: use label slot or specify tdsAriaLabel prop');
54
- }
55
- }
56
49
  render() {
57
- return (h(Host, { key: '6ab1d0f1d475d6d0a486e1909cad300d89eb39a0' }, h("div", { key: 'bfe11cdc8c2bf592cec7f3cf8888555071781afe', class: {
50
+ return (h(Host, { key: 'd3f0a943b953783f2fc1c6345563a5adf0ded1dd' }, h("div", { key: 'c7028ceb31b9409d76d3663cd92a1fb3fa68fd7e', class: {
58
51
  'state-open': this.open,
59
- } }, h("tds-header-item", { key: '27b6d2680858443a26d7108b5318386df76db788', class: "button", active: this.open, selected: this.selected }, h("button", { key: '09d0ccb3bc5a31a897af65f5fcf4d47ee8b35192', ref: (el) => {
52
+ } }, h("tds-header-item", { key: 'f1d5fe99ee0b62316dd0b48c9b5bb04439fb9b12', class: "button", active: this.open, selected: this.selected }, h("button", { key: '0e1437b558782c96e984287bfc0b9f301090bdb0', ref: (el) => {
60
53
  this.buttonEl = el;
61
54
  }, "aria-expanded": `${this.open}`, "aria-controls": `launcher-${this.uuid}`, "aria-current": this.selected ? 'location' : 'false', onClick: () => {
62
55
  this.toggleDropdown();
63
- }, "aria-label": this.tdsAriaLabel }, h("slot", { key: '50c872c297116ece9dd5da41398aac3bd88cd529', name: "icon" }), this.label, h("slot", { key: '141a43cdc4c8aeade4d547bbb91a28f62542bb98', name: "label" }), !this.noDropdownIcon && (h("tds-icon", { key: '13f2f8d6b264f09dea45e9b7809adab1b83db683', class: "dropdown-icon", name: "chevron_down", size: "16px", svgTitle: "Dropdown icon" })))), this.buttonEl && (h("tds-popover-canvas", { key: '10b18c15ae1d2c0fbafaa82bed4ae7759c857c54', id: `tds-dropdown-${this.uuid}`, class: "menu", referenceEl: this.buttonEl, placement: "bottom-start", show: this.open, offsetDistance: 0, modifiers: [
56
+ }, "aria-label": this.tdsAriaLabel }, h("slot", { key: 'fc63cfe2414eb2c60fe85e481a3af49af3ce9653', name: "icon" }), this.label, h("slot", { key: 'f302406472c7be0223fa17b76cc2674cb3e148b7', name: "label" }), !this.noDropdownIcon && (h("tds-icon", { key: '32c53b88ffeed4a78f9efc77b5976afe190c86c6', class: "dropdown-icon", name: "chevron_down", size: "16px", svgTitle: "Dropdown icon" })))), this.buttonEl && (h("tds-popover-canvas", { key: '86ed4a3140d80521792b2953bc4acdef9476c3f6', id: `tds-dropdown-${this.uuid}`, class: "menu", referenceEl: this.buttonEl, placement: "bottom-start", show: this.open, offsetDistance: 0, modifiers: [
64
57
  {
65
58
  name: 'flip',
66
59
  options: {
@@ -4,14 +4,9 @@ export class TdsHeaderHamburger {
4
4
  constructor() {
5
5
  this.tdsAriaLabel = undefined;
6
6
  }
7
- connectedCallback() {
8
- if (!this.tdsAriaLabel) {
9
- console.warn('Tegel Header Hamburger component: missing tdsAriaLabel prop');
10
- }
11
- }
12
7
  render() {
13
8
  const inheritedButtonProps = Object.assign({}, inheritAriaAttributes(this.host));
14
- return (h(Host, { key: '5ea87f94483c167f580c26c7914a22cb6caea885' }, h("tds-header-item", { key: 'f2792ffbd859c263165b95b7d2cd9d1c76509c8f' }, h("button", Object.assign({ key: 'd1c44fcf5b7bb9c3cefbbbf09e3217704770f761' }, inheritedButtonProps, { "aria-label": this.tdsAriaLabel }), h("tds-icon", { key: '62ec94113557c7032a3145ad4b6ac22d39d6453c', class: "icon", name: "burger", size: "20px" })))));
9
+ return (h(Host, { key: 'e89db0f35bac2766a531be705b37c1d02e315431' }, h("tds-header-item", { key: '2aba0027ff9ce0516722d9785df5f61cd69aa02e' }, h("button", Object.assign({ key: 'f3b03d5b8a13285972edc9c645effc91c3ec92ad' }, inheritedButtonProps, { "aria-label": this.tdsAriaLabel }), h("tds-icon", { key: '6177dfc5ec0fed7902ecea6bab75b6031099c9c3', class: "icon", name: "burger", size: "20px" })))));
15
10
  }
16
11
  static get is() { return "tds-header-hamburger"; }
17
12
  static get encapsulation() { return "shadow"; }
@@ -41,11 +41,6 @@ export class TdsHeaderLauncher {
41
41
  });
42
42
  }
43
43
  }
44
- connectedCallback() {
45
- if (!this.tdsAriaLabel) {
46
- console.warn('Tegel Header Launcher component: missing tdsAriaLabel prop');
47
- }
48
- }
49
44
  render() {
50
45
  this.ariaAttributes = Object.assign(Object.assign({}, this.ariaAttributes), inheritAriaAttributes(this.host, ['role']));
51
46
  const buttonAttributes = Object.assign(Object.assign({}, this.ariaAttributes), { 'aria-expanded': `${this.open}`, 'aria-controls': `launcher-${this.uuid}`, 'class': 'button', 'active': this.open, 'onClick': () => {
@@ -53,11 +48,11 @@ export class TdsHeaderLauncher {
53
48
  }, 'ref': (el) => {
54
49
  this.buttonEl = el;
55
50
  } });
56
- return (h(Host, { key: 'a1c8cce3e26d57b654700893add3e5e1554e23d0' }, h("div", { key: 'bfc4e2f77d142f4913a4509b0c16b7503c942bf3', class: {
51
+ return (h(Host, { key: 'b62aac321e36b12d139d51c3421a1a9540079c22' }, h("div", { key: '4bb1d8e74ec245d9899870fccd990935488dcf7b', class: {
57
52
  'wrapper': true,
58
53
  'state-open': this.open,
59
54
  'state-list-type-menu': this.hasListTypeMenu,
60
- } }, h("tds-header-launcher-button", Object.assign({ key: 'c30e8b26d73a8d3a5aa5bf476226419b70c26061' }, buttonAttributes, { "tds-aria-label": this.tdsAriaLabel })), this.buttonEl && (h("tds-popover-canvas", { key: '10e13ac7fb52c3123dd51d1f91754262feb56134', id: `tds-launcher-${this.uuid}`, class: "menu", referenceEl: this.buttonEl, placement: "bottom-start", show: this.open, offsetDistance: 0, modifiers: [
55
+ } }, h("tds-header-launcher-button", Object.assign({ key: 'c3b90d64efd2878ffc2b0332538c2877f2b48fec' }, buttonAttributes, { "tds-aria-label": this.tdsAriaLabel })), this.buttonEl && (h("tds-popover-canvas", { key: 'dd41f1e0573ceed07f519813bec503001d02377b', id: `tds-launcher-${this.uuid}`, class: "menu", referenceEl: this.buttonEl, placement: "bottom-start", show: this.open, offsetDistance: 0, modifiers: [
61
56
  {
62
57
  name: 'flip',
63
58
  options: {
@@ -15,6 +15,10 @@
15
15
  padding: 0;
16
16
  }
17
17
 
18
+ :host(.tds-table__row:hover) {
19
+ border-bottom: 1px solid var(--tds-table-divider-hover);
20
+ }
21
+
18
22
  :host(.tds-table__row:hover) {
19
23
  background-color: var(--tds-table-body-row-background-hover);
20
24
  }
@@ -67,16 +67,11 @@ export class TdsTextField {
67
67
  this.textInput.focus();
68
68
  }
69
69
  }
70
- connectedCallback() {
71
- if (!this.tdsAriaLabel) {
72
- console.warn('Tegel Text Field component: prop tdsAriaLabel is missing');
73
- }
74
- }
75
70
  render() {
76
71
  var _a;
77
72
  const usesPrefixSlot = hasSlot('prefix', this.host);
78
73
  const usesSuffixSlot = hasSlot('suffix', this.host);
79
- return (h("div", { key: 'd89807d294eef78042812ab972347b02bf09ca3b', class: {
74
+ return (h("div", { key: 'b9fa2b03ce2a0b196dc6083614420d6f83675e3d', class: {
80
75
  'form-text-field': true,
81
76
  'form-text-field-nomin': this.noMinWidth,
82
77
  'text-field-focus': this.focusInput && !this.disabled,
@@ -94,12 +89,12 @@ export class TdsTextField {
94
89
  'form-text-field-sm': this.size === 'sm',
95
90
  'form-text-field-error': this.state === 'error',
96
91
  'form-text-field-success': this.state === 'success',
97
- } }, this.labelPosition === 'outside' && (h("div", { key: 'e47d71e8415802cef02fd832d67ae3fabc941f61', class: "text-field-label-outside" }, h("label", { key: 'a840356fe2a5758bb8d219a42121d4896fb460e9', htmlFor: `text-field-input-element-${this.uuid}` }, this.label))), h("div", { key: '937a2edc262e2d2f7523b18d562e847f4c6a68cf', onClick: () => this.textInput.focus(), class: "text-field-container" }, usesPrefixSlot && (h("div", { key: 'ffec573debf07ce940c56e0c5b53b37ffb3e4a7b', class: {
92
+ } }, this.labelPosition === 'outside' && (h("div", { key: '7110b867aba9a9ba62b796f67caeccf22a4a8060', class: "text-field-label-outside" }, h("label", { key: '6b0b6c7d17bb236f1203dfaf793ba0a3bc2d8efb', htmlFor: `text-field-input-element-${this.uuid}` }, this.label))), h("div", { key: '5603d3e78b290a78d7c482a0dac7e1f0efb9af7f', onClick: () => this.textInput.focus(), class: "text-field-container" }, usesPrefixSlot && (h("div", { key: '9accb59dffa061d7947d4392310cb1717a395363', class: {
98
93
  'text-field-slot-wrap-prefix': true,
99
94
  'text-field-error': this.state === 'error',
100
95
  'text-field-success': this.state === 'success',
101
96
  'text-field-default': this.state === 'default',
102
- } }, h("slot", { key: '0024d886c26708f326f9750fce178c0d916e1fcd', name: "prefix" }))), h("div", { key: '6612a79dca8842c4fa50683a28d33d4a813a6557', class: "text-field-input-container" }, h("input", { key: 'f3a3a2476289e3b87409dbf5bb67c8983c5cdcd3', ref: (inputEl) => {
97
+ } }, h("slot", { key: '739e089cdb9798dc108b68c4858c90bf75e18958', name: "prefix" }))), h("div", { key: 'e4229be4e4bf421319184e798b98afcbaa361413', class: "text-field-input-container" }, h("input", { key: 'f462b4c0d49e4e070090f6a14df52af66b87648d', ref: (inputEl) => {
103
98
  this.textInput = inputEl;
104
99
  }, class: {
105
100
  'text-field-input': true,
@@ -114,13 +109,13 @@ export class TdsTextField {
114
109
  if (!this.readOnly) {
115
110
  this.handleBlur(event);
116
111
  }
117
- }, "aria-label": this.tdsAriaLabel ? this.tdsAriaLabel : this.label, "aria-describedby": `text-field-helper-element-${this.uuid}`, "aria-readonly": this.readOnly, id: `text-field-input-element-${this.uuid}` }), this.labelPosition === 'inside' && this.size !== 'sm' && (h("label", { key: '85148d3ad53ac2261f39fab3951e34d6031fe491', class: "text-field-label-inside", htmlFor: `text-field-input-element-${this.uuid}` }, this.label))), usesSuffixSlot && (h("div", { key: '77f9d1ed7b40199e061800bae45302341df1d0af', class: {
112
+ }, "aria-label": this.tdsAriaLabel ? this.tdsAriaLabel : this.label, "aria-describedby": `text-field-helper-element-${this.uuid}`, "aria-readonly": this.readOnly, id: `text-field-input-element-${this.uuid}` }), this.labelPosition === 'inside' && this.size !== 'sm' && (h("label", { key: 'ac16cff7856d65503fa30f7eb23d2936377e72d4', class: "text-field-label-inside", htmlFor: `text-field-input-element-${this.uuid}` }, this.label))), usesSuffixSlot && (h("div", { key: 'b70453ec36ca62f584b26b0e6dc4b3f0cde2ff54', class: {
118
113
  'text-field-slot-wrap-suffix': true,
119
114
  'text-field-error': this.state === 'error',
120
115
  'text-field-success': this.state === 'success',
121
116
  'text-field-default': this.state === 'default',
122
117
  'tds-u-display-none': this.readOnly,
123
- } }, h("slot", { key: '7a9203d50ea16fdb458a3d358a01bec0c661e7ca', name: "suffix" }))), this.readOnly && !this.hideReadOnlyIcon && (h("span", { key: 'bb34a69cc01434a54c4342cbf96aae669af98253', class: "text-field-icon__readonly" }, h("tds-tooltip", { key: 'da79d41977a5f5a7467aa5e715789eb6a867577f', placement: "top-end", text: "This field is non-editable", selector: "#readonly-tooltip" }), h("tds-icon", { key: '1f917eac514d3128e8a201d8e2e376307c0c57cd', id: "readonly-tooltip", name: "edit_inactive", size: "20px" })))), h("div", { key: '25a79dadfa1c8d861a80896d09f707b1e4ad8b13', "aria-live": "assertive" }, (this.helper || this.maxLength > 0) && (h("div", { key: '41fa7982f60abb6fd0f1cd08a0c6d86b54c07582', class: "text-field-helper", id: `text-field-helper-element-${this.uuid}` }, this.state === 'error' && (h("div", { key: 'fca92c6f194be9ff3429025ecec53d5f2787b317', class: "text-field-helper-error-state" }, !this.readOnly && h("tds-icon", { key: 'ef3f9f97512f7de24c70a2eaaa7eb1a55019e512', name: "error", size: "16px" }), this.helper)), this.state !== 'error' && this.helper, !this.readOnly && this.maxLength > 0 && (h("span", { key: '3152f09bf0b2f855ea80fc73fc9746265833ed20', class: {
118
+ } }, h("slot", { key: '7e50b20d90a68f9af583b8f2ade5c742e2d52351', name: "suffix" }))), this.readOnly && !this.hideReadOnlyIcon && (h("span", { key: '72e2cf4f2872d247ac6f28e935e8185aafef6dec', class: "text-field-icon__readonly" }, h("tds-tooltip", { key: '171bdde8535c6bbd08eec60d87d9aa5bae1f98bd', placement: "top-end", text: "This field is non-editable", selector: "#readonly-tooltip" }), h("tds-icon", { key: '05e7e8898ee3fcf81fb011aa2141092e8b749e37', id: "readonly-tooltip", name: "edit_inactive", size: "20px" })))), h("div", { key: '0c16d399b376d9aebed2aabf759cb7319c5745cf', "aria-live": "assertive" }, (this.helper || this.maxLength > 0) && (h("div", { key: '280eed9185c8cffa29e3cf62425f1f1f377f3abc', class: "text-field-helper", id: `text-field-helper-element-${this.uuid}` }, this.state === 'error' && (h("div", { key: 'ddf07e469173a574a848cd2ff816bcc535940340', class: "text-field-helper-error-state" }, !this.readOnly && h("tds-icon", { key: 'b5b06dba13fb8911828153341b631facfc016c88', name: "error", size: "16px" }), this.helper)), this.state !== 'error' && this.helper, !this.readOnly && this.maxLength > 0 && (h("span", { key: 'a4c41817f19b32e575423d5bbe19c28a38031e6e', class: {
124
119
  'text-field-textcounter-divider': true,
125
120
  'text-field-textcounter-disabled': this.disabled,
126
121
  } }, this.value === null ? 0 : (_a = this.value) === null || _a === void 0 ? void 0 : _a.length, " / ", this.maxLength)))))));
@@ -58,14 +58,9 @@ export class TdsTextarea {
58
58
  }
59
59
  return modeVariant;
60
60
  }
61
- connectedCallback() {
62
- if (!this.tdsAriaLabel && !this.label) {
63
- console.warn('Tegel Textarea component: specify label or tdsAriaLabel prop for accessibility');
64
- }
65
- }
66
61
  render() {
67
62
  var _a;
68
- return (h("div", { key: 'dbb067dbc07d73dd30899c6e56a6d2ddf65f4d9a', class: {
63
+ return (h("div", { key: '873fc5866c777549e56d115e7bce64a62fdd5c0c', class: {
69
64
  'textarea-container': true,
70
65
  'textarea-label-inside': this.labelPosition === 'inside',
71
66
  'textarea-focus': this.focusInput,
@@ -75,7 +70,7 @@ export class TdsTextarea {
75
70
  'textarea-data': this.value !== '',
76
71
  [`textarea-${this.state}`]: this.state === 'error' || this.state === 'success',
77
72
  'no-min-width': this.noMinWidth,
78
- } }, this.labelPosition !== 'no-label' && (h("label", { key: 'c3681b8bc8737b6c2a6b94c6eda9f7b8cb019ebe', htmlFor: `textarea-element-${this.uuid}`, class: 'textarea-label' }, this.label)), h("div", { key: 'bccc4229cc69671ba19a0c06005fea2a48746925', class: "textarea-wrapper" }, h("textarea", { key: '0806c50f3f95c7c9021ddabf4918c0d6e3f81380', id: `textarea-element-${this.uuid}`, class: 'textarea-input', ref: (inputEl) => {
73
+ } }, this.labelPosition !== 'no-label' && (h("label", { key: '09f5df4efb39b7e3eb71d8567adc5cffd374ad66', htmlFor: `textarea-element-${this.uuid}`, class: 'textarea-label' }, this.label)), h("div", { key: '57bd6d6e2e7a1919d668625a675e4a20421af965', class: "textarea-wrapper" }, h("textarea", { key: '69955de378170f86c7a942d5f8101aa2ff9440f4', id: `textarea-element-${this.uuid}`, class: 'textarea-input', ref: (inputEl) => {
79
74
  this.textEl = inputEl;
80
75
  }, disabled: this.disabled, readonly: !this.disabled && this.readOnly, placeholder: this.placeholder, value: this.value, name: this.name, autofocus: this.autofocus, maxlength: this.maxLength, cols: this.cols, rows: this.rows, onFocus: (event) => {
81
76
  if (!this.readOnly) {
@@ -85,7 +80,7 @@ export class TdsTextarea {
85
80
  if (!this.readOnly) {
86
81
  this.handleBlur(event);
87
82
  }
88
- }, onInput: (event) => this.handleInput(event), onChange: (event) => this.handleChange(event), "aria-invalid": this.state === 'error' ? 'true' : 'false', "aria-readonly": this.readOnly ? 'true' : 'false', "aria-label": this.tdsAriaLabel ? this.tdsAriaLabel : this.label, "aria-describedby": `textarea-helper-element-${this.uuid}` }), h("span", { key: '5eeecd4cf85beebb5e816bca7561f475387772ca', class: "textarea-resizer-icon" }, h("svg", { key: 'bb48c69769507bb9878515069b44057306959694', width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '48f548d1a43e3cbb289f396719686b3441df5730', "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M11.8536 0.853553C12.0488 0.658291 12.0488 0.341709 11.8536 0.146447C11.6583 -0.0488155 11.3417 -0.0488155 11.1464 0.146447L0.146447 11.1464C-0.0488155 11.3417 -0.0488155 11.6583 0.146447 11.8536C0.341709 12.0488 0.658291 12.0488 0.853553 11.8536L11.8536 0.853553ZM11.8536 4.64645C12.0488 4.84171 12.0488 5.15829 11.8536 5.35355L5.35355 11.8536C5.15829 12.0488 4.84171 12.0488 4.64645 11.8536C4.45118 11.6583 4.45118 11.3417 4.64645 11.1464L11.1464 4.64645C11.3417 4.45118 11.6583 4.45118 11.8536 4.64645ZM11.8536 8.64645C12.0488 8.84171 12.0488 9.15829 11.8536 9.35355L9.35355 11.8536C9.15829 12.0488 8.84171 12.0488 8.64645 11.8536C8.45118 11.6583 8.45118 11.3417 8.64645 11.1464L11.1464 8.64645C11.3417 8.45118 11.6583 8.45118 11.8536 8.64645Z", fill: "currentColor" }))), !this.disabled && !this.hideReadOnlyIcon && this.readOnly && (h("span", { key: '91c5fa06139ad42018887c13444fd83020628d28', class: "textarea-icon__readonly" }, h("tds-tooltip", { key: '74f06a7752bf835fc95bacc1c4c385d88a46e5b9', placement: "top-end", text: "This field is non-editable", selector: "#readonly-tooltip" }), h("tds-icon", { key: 'b2d04f90a8011ef718aa0041832b33109424f335', id: "readonly-tooltip", name: "edit_inactive", svgTitle: "inactive" })))), h("span", { key: '2bc9ed0ab5140c934d7a94f3c295277b2d532dc2', class: 'textarea-helper', "aria-live": "assertive", id: `textarea-helper-element-${this.uuid}` }, this.state === 'error' && this.helper && !this.readOnly && (h("tds-icon", { key: '5c0ddf9ae955053a98ac866e4d6676d9b3c21553', name: "error", size: "16px" })), this.helper), this.maxLength > 0 && (h("div", { key: '8857cf39cefe8fb99f2127710a8a42666668a1f5', class: 'textarea-textcounter' }, this.value === null ? 0 : (_a = this.value) === null || _a === void 0 ? void 0 : _a.length, h("span", { key: '26a2c8b6b07658fbb49f772729071ca33a0dda41', class: "textfield-textcounter-divider" }, " / "), " ", this.maxLength))));
83
+ }, onInput: (event) => this.handleInput(event), onChange: (event) => this.handleChange(event), "aria-invalid": this.state === 'error' ? 'true' : 'false', "aria-readonly": this.readOnly ? 'true' : 'false', "aria-label": this.tdsAriaLabel ? this.tdsAriaLabel : this.label, "aria-describedby": `textarea-helper-element-${this.uuid}` }), h("span", { key: '0fded8e72f3f6d8e6f53cb57df94f480df17ce53', class: "textarea-resizer-icon" }, h("svg", { key: '6b41ae06bbedfa5ba88991bc6856f80ca8a4b6f8', width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: 'c4f731e7483bade2d0dbd545302afc278039a122', "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M11.8536 0.853553C12.0488 0.658291 12.0488 0.341709 11.8536 0.146447C11.6583 -0.0488155 11.3417 -0.0488155 11.1464 0.146447L0.146447 11.1464C-0.0488155 11.3417 -0.0488155 11.6583 0.146447 11.8536C0.341709 12.0488 0.658291 12.0488 0.853553 11.8536L11.8536 0.853553ZM11.8536 4.64645C12.0488 4.84171 12.0488 5.15829 11.8536 5.35355L5.35355 11.8536C5.15829 12.0488 4.84171 12.0488 4.64645 11.8536C4.45118 11.6583 4.45118 11.3417 4.64645 11.1464L11.1464 4.64645C11.3417 4.45118 11.6583 4.45118 11.8536 4.64645ZM11.8536 8.64645C12.0488 8.84171 12.0488 9.15829 11.8536 9.35355L9.35355 11.8536C9.15829 12.0488 8.84171 12.0488 8.64645 11.8536C8.45118 11.6583 8.45118 11.3417 8.64645 11.1464L11.1464 8.64645C11.3417 8.45118 11.6583 8.45118 11.8536 8.64645Z", fill: "currentColor" }))), !this.disabled && !this.hideReadOnlyIcon && this.readOnly && (h("span", { key: '94bc8eed69418751ad240087201827a0ef0185b4', class: "textarea-icon__readonly" }, h("tds-tooltip", { key: '231983d3994030724a06358f37dd0e53f91d78d4', placement: "top-end", text: "This field is non-editable", selector: "#readonly-tooltip" }), h("tds-icon", { key: '9e7f16d10939227a5c8c87f00ddd653a58c094ad', id: "readonly-tooltip", name: "edit_inactive", svgTitle: "inactive" })))), h("span", { key: '67222f0c93979caf49881c591cd99eb4c97ebdc1', class: 'textarea-helper', "aria-live": "assertive", id: `textarea-helper-element-${this.uuid}` }, this.state === 'error' && this.helper && !this.readOnly && (h("tds-icon", { key: 'cbde13084b090f7eea4bd80da47373ec941e1981', name: "error", size: "16px" })), this.helper), this.maxLength > 0 && (h("div", { key: '5895277b2e07f4c8f2990f624eb0797dffd0b1f0', class: 'textarea-textcounter' }, this.value === null ? 0 : (_a = this.value) === null || _a === void 0 ? void 0 : _a.length, h("span", { key: '97afedbb5aaf02461a38f39643298b6c2650c52f', class: "textfield-textcounter-divider" }, " / "), " ", this.maxLength))));
89
84
  }
90
85
  static get is() { return "tds-textarea"; }
91
86
  static get encapsulation() { return "scoped"; }
@@ -38,16 +38,13 @@ export class TdsToggle {
38
38
  componentWillLoad() {
39
39
  this.labelSlot = this.host.querySelector("[slot='label']");
40
40
  }
41
- connectedCallback() {
42
- if (!this.tdsAriaLabel) {
43
- console.warn('Tegel Toggle component: tdsAriaLabel prop is missing');
44
- }
45
- }
46
41
  render() {
47
- return (h("div", { key: '0c3887693add4f6b50afc806dcfb487d82666727', class: "tds-toggle" }, this.headline && (h("div", { key: '43c3b28ecb7f454a2c18f687cbccdb5e530880f6', class: {
42
+ return (h("div", { key: '68e34abfad735ed96e35e0f7966670e226dcbc82', class: "tds-toggle" }, this.headline && (h("div", { key: '3784ca8234261dd269d0f641a5f2515abae0ece4', class: {
48
43
  'toggle-headline': true,
49
44
  'disabled': this.disabled,
50
- } }, this.headline)), h("input", { key: 'ab27905a8bcf70a9d5955aeae548180bd98960b3', ref: (inputEl) => (this.inputElement = inputEl), "aria-label": this.tdsAriaLabel, "aria-describedby": this.host.getAttribute('aria-describedby'), "aria-labelledby": this.host.getAttribute('aria-labelledby'), "aria-checked": this.checked, "aria-required": this.required, onChange: () => this.handleToggle(), class: `${this.size}`, checked: this.checked, disabled: this.disabled, required: this.required, type: "checkbox", name: this.name, id: this.toggleId, role: "switch" }), this.labelSlot && (h("label", { key: 'ee30668b9de5fc36fd1dbd770d706ee31940f420', class: { disabled: this.disabled }, htmlFor: this.toggleId }, h("slot", { key: 'a96163abcf60dae5ef23ffa3b73b83c10cb931b3', name: "label" })))));
45
+ } }, this.headline)), h("input", { key: '675a0c941bce13fc053411b8faf7fe583cbf3245', ref: (inputEl) => {
46
+ this.inputElement = inputEl;
47
+ }, "aria-label": this.tdsAriaLabel, "aria-describedby": this.host.getAttribute('aria-describedby'), "aria-labelledby": this.host.getAttribute('aria-labelledby'), "aria-checked": this.checked, "aria-required": this.required, onChange: () => this.handleToggle(), class: `${this.size}`, checked: this.checked, disabled: this.disabled, required: this.required, type: "checkbox", name: this.name, id: this.toggleId, role: "switch" }), this.labelSlot && (h("label", { key: '2c73df3e48968f3c95de4b4e14817abf57423f98', class: { disabled: this.disabled }, htmlFor: this.toggleId }, h("slot", { key: 'd1f660a5f25b8bd2ffef2e6cf9574d429cb4ca8a', name: "label" })))));
51
48
  }
52
49
  static get is() { return "tds-toggle"; }
53
50
  static get encapsulation() { return "scoped"; }
@@ -64,17 +64,12 @@ const TdsCheckbox = /*@__PURE__*/ proxyCustomElement(class TdsCheckbox extends H
64
64
  this.indeterminate = false;
65
65
  }
66
66
  }
67
- connectedCallback() {
68
- if (!this.tdsAriaLabel) {
69
- console.warn('Tegel Checkbox component: tdsAriaLabel prop is missing');
70
- }
71
- }
72
67
  render() {
73
- return (h("div", { key: '97afce57b6f6ce0d66dabd227f7271b5dc8fe707', class: "tds-checkbox" }, h("input", { key: '18b283a21ff649b9a4935a7b3e6f489cde16073d',
68
+ return (h("div", { key: '87d4e8620e183b5fb8a885dca8081424c7497b21', class: "tds-checkbox" }, h("input", { key: 'fa5d4c8e9a33a7a88d1348f6eb66b474e94c0ad1',
74
69
  // eslint-disable-next-line no-return-assign
75
70
  ref: (inputElement) => (this.inputElement = inputElement), indeterminate: this.indeterminate, "aria-checked": this.checked, "aria-required": this.required, "aria-label": this.tdsAriaLabel, "aria-describedby": this.tdsAriaDescribedby, required: this.required, type: "checkbox", name: this.name, value: this.value, id: this.checkboxId, checked: this.checked, disabled: this.disabled, onFocus: (event) => this.handleFocus(event), onBlur: (event) => this.handleBlur(event), onChange: () => {
76
71
  this.handleChange();
77
- } }), h("label", { key: '51d15b0eea1fd0f7517ca8d0f669bc02ac59781c', htmlFor: this.checkboxId }, h("slot", { key: 'bb10126c57b177f825ef8cd75da505465b2d6ae3', name: "label" }))));
72
+ } }), h("label", { key: '82545f01ad68fae4d613b58d82a770a0c1bce79e', htmlFor: this.checkboxId }, h("slot", { key: '99892e112b596a7f8517427cc42f75e90140c315', name: "label" }))));
78
73
  }
79
74
  get host() { return this; }
80
75
  static get watchers() { return {
@@ -185,12 +185,11 @@ const TdsDropdown = /*@__PURE__*/ proxyCustomElement(class TdsDropdown extends H
185
185
  }
186
186
  };
187
187
  this.handleFilterReset = () => {
188
- this.reset();
188
+ // Only clear the input text and filter, don't reset the selected option
189
189
  this.inputElement.value = '';
190
190
  this.handleFilter({ target: { value: '' } });
191
191
  this.inputElement.focus();
192
- // Add this line to ensure internal value is cleared
193
- this.internalValue = '';
192
+ // Don't clear internalValue or call reset() - preserve the selected option
194
193
  };
195
194
  this.handleFocus = (event) => {
196
195
  this.open = true;
@@ -505,11 +504,6 @@ const TdsDropdown = /*@__PURE__*/ proxyCustomElement(class TdsDropdown extends H
505
504
  form.removeEventListener('reset', this.resetInput);
506
505
  }
507
506
  }
508
- connectedCallback() {
509
- if (!this.tdsAriaLabel) {
510
- console.warn('Tegel Dropdown component: tdsAriaLabel prop is missing');
511
- }
512
- }
513
507
  updateDropdownListInertState() {
514
508
  if (this.dropdownList) {
515
509
  if (this.open) {
@@ -525,9 +519,9 @@ const TdsDropdown = /*@__PURE__*/ proxyCustomElement(class TdsDropdown extends H
525
519
  // Generate unique IDs for associating labels and helpers with the input/button
526
520
  const labelId = this.label ? `dropdown-label-${this.name || generateUniqueId()}` : undefined;
527
521
  const helperId = this.helper ? `dropdown-helper-${this.name || generateUniqueId()}` : undefined;
528
- return (h(Host, { key: '676f9d61c5fd8488cedbc949757e992be13e49eb', class: {
522
+ return (h(Host, { key: 'c3d90008af3a9376540a5058b64349ec3235acb0', class: {
529
523
  [`tds-mode-variant-${this.modeVariant}`]: Boolean(this.modeVariant),
530
- } }, this.label && this.labelPosition === 'outside' && (h("div", { key: 'ac4f3c9ca2719acc72f06ae977bf032d05913c6d', id: labelId, class: `label-outside ${this.disabled ? 'disabled' : ''}` }, this.label)), h("div", { key: 'c9d4142f63e315c73daef5038f266a32b05559a1', class: {
524
+ } }, this.label && this.labelPosition === 'outside' && (h("div", { key: 'fc60cdf4d107cf74d07d0df1582dc8bc14020b08', id: labelId, class: `label-outside ${this.disabled ? 'disabled' : ''}` }, this.label)), h("div", { key: '0cddc37f241453e5c8d80292b50865c8274fc70c', class: {
531
525
  'dropdown-select': true,
532
526
  [this.size]: true,
533
527
  'disabled': this.disabled,
@@ -577,7 +571,7 @@ const TdsDropdown = /*@__PURE__*/ proxyCustomElement(class TdsDropdown extends H
577
571
  label-inside-as-placeholder
578
572
  ${this.size}
579
573
  ${this.selectedOptions.length ? 'selected' : ''}
580
- ` }, this.label)), h("div", { class: `placeholder ${this.size}` }, this.selectedOptions.length ? this.getValue() : this.placeholder), h("tds-icon", { "aria-label": "Open/Close dropdown", svgTitle: "Open/Close dropdown", class: `menu-icon ${this.open ? 'open' : 'closed'}`, name: "chevron_down", size: "16px" }))))), h("div", { key: '6de931198040eec79815f83e2617d2646507b6a1', role: "listbox", "aria-label": this.tdsAriaLabel, inert: !this.open, "aria-orientation": "vertical", "aria-multiselectable": this.multiselect, ref: (element) => {
574
+ ` }, this.label)), h("div", { class: `placeholder ${this.size}` }, this.selectedOptions.length ? this.getValue() : this.placeholder), h("tds-icon", { "aria-label": "Open/Close dropdown", svgTitle: "Open/Close dropdown", class: `menu-icon ${this.open ? 'open' : 'closed'}`, name: "chevron_down", size: "16px" }))))), h("div", { key: '107220cfc03a19eb3735b2f33b1af145b4f51094', role: "listbox", "aria-label": this.tdsAriaLabel, inert: !this.open, "aria-orientation": "vertical", "aria-multiselectable": this.multiselect, ref: (element) => {
581
575
  this.dropdownList = element;
582
576
  }, class: {
583
577
  'dropdown-list': true,
@@ -588,11 +582,11 @@ const TdsDropdown = /*@__PURE__*/ proxyCustomElement(class TdsDropdown extends H
588
582
  'closed': !this.open,
589
583
  [`animation-enter-${this.animation}`]: this.animation !== 'none' && this.open,
590
584
  [`animation-exit-${this.animation}`]: this.animation !== 'none' && !this.open,
591
- } }, h("slot", { key: '61ab9737181371073b25b95c34dad3311c2995c0', onSlotchange: () => this.handleSlotChange() }), this.filterResult === 0 && this.noResultText !== '' && (h("div", { key: 'aca39f881a57a6a23de03da78b5062e5dff55af7', class: `no-result ${this.size}` }, this.noResultText))), this.helper && (h("div", { key: '1e4221e58bc16608bfb0f780b7bc8040935eab37', id: helperId, class: {
585
+ } }, h("slot", { key: 'fb2baca104f77a24fed845719131d1d7b73e8226', onSlotchange: () => this.handleSlotChange() }), this.filterResult === 0 && this.noResultText !== '' && (h("div", { key: 'e34ef314336b3537e2735d832367ee364ec0102c', class: `no-result ${this.size}` }, this.noResultText))), this.helper && (h("div", { key: '2c28f6d1178f58f2526fc6e56a734b29eed17a49', id: helperId, class: {
592
586
  helper: true,
593
587
  error: this.error,
594
588
  disabled: this.disabled,
595
- } }, this.error && h("tds-icon", { key: 'ec946e77add75e7eaf194e2b38e5dd1c548ab32f', name: "error", size: "16px" }), this.helper))));
589
+ } }, this.error && h("tds-icon", { key: '23234ccade4136e2240f87edf5adf36d1fc32b8a', name: "error", size: "16px" }), this.helper))));
596
590
  }
597
591
  get host() { return this; }
598
592
  static get watchers() { return {
@@ -1,6 +1,6 @@
1
1
  import { p as proxyCustomElement, H, d as createEvent, h, c as Host } from './p-28ef5186.js';
2
2
  import { c as convertToString } from './p-a1181b1f.js';
3
- import { d as defineCustomElement$2 } from './p-23aab3b9.js';
3
+ import { d as defineCustomElement$2 } from './p-44f5b5e1.js';
4
4
  import { d as defineCustomElement$1 } from './p-b390ece5.js';
5
5
 
6
6
  const dropdownOptionCss = ":host{box-sizing:border-box;display:block;background-color:var(--tds-dropdown-option-background)}:host *{box-sizing:border-box}:host .dropdown-option{color:var(--tds-dropdown-option-color);border-bottom:1px solid var(--tds-dropdown-option-border);font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);overflow-wrap:anywhere;transition:background-color var(--tds-motion-duration-fast-02) var(--tds-motion-easing-scania)}:host .dropdown-option.selected{background-color:var(--tds-dropdown-option-background-selected)}:host .dropdown-option.disabled{color:var(--tds-dropdown-option-color-disabled)}:host .dropdown-option button:focus{outline:2px solid var(--tds-dropdown-option-focus);box-shadow:inset 0 0 0 3px var(--tds-white);outline-offset:-2px}:host .dropdown-option button{all:unset;width:100%}:host .dropdown-option button.lg{padding:19px 0 20px}:host .dropdown-option button.md{padding:15px 0 16px}:host .dropdown-option button.sm{padding:11px 0 12px}:host .dropdown-option button.xs{padding:7px 0 8px}:host .dropdown-option button .single-select{display:flex;align-items:center;justify-content:space-between;padding:0 16px}:host .dropdown-option .multiselect{width:100%;height:100%}:host .dropdown-option .multiselect tds-checkbox{display:flex;height:100%;width:100%}:host .dropdown-option .multiselect tds-checkbox.lg{padding:15px 16px 16px}:host .dropdown-option .multiselect tds-checkbox.md{padding:11px 16px 12px}:host .dropdown-option .multiselect tds-checkbox.sm{padding:7px 16px 8px}:host .dropdown-option .multiselect tds-checkbox.xs{padding:7px 16px 8px}:host .dropdown-option:hover{border-bottom-color:var(--tds-dropdown-option-border-hover);cursor:pointer}:host .dropdown-option:hover.disabled{border-bottom-color:var(--tds-dropdown-option-border-hover);cursor:not-allowed}:host([hidden]){display:none}";
@@ -89,13 +89,8 @@ const TdsDropdownOption = /*@__PURE__*/ proxyCustomElement(class TdsDropdownOpti
89
89
  componentWillLoad() {
90
90
  this.internalValue = convertToString(this.value);
91
91
  }
92
- connectedCallback() {
93
- if (!this.tdsAriaLabel && !this.multiselect) {
94
- console.warn('Tegel Dropdown option component: tdsAriaLabel prop is missing');
95
- }
96
- }
97
92
  render() {
98
- return (h(Host, { key: '52827112a3060a8858978c3e65c284358f923539' }, h("div", { key: 'edf5262e5dbbfadf34ff6faa164e58b7fec1e561', class: `dropdown-option
93
+ return (h(Host, { key: 'd35a3153be292b1656d0efca93f06bfc1357041b' }, h("div", { key: '384353f9868a3fb559ca4140d5cd4f5553e024ad', class: `dropdown-option
99
94
  ${this.size}
100
95
  ${this.selected ? 'selected' : ''}
101
96
  ${this.disabled ? 'disabled' : ''}
@@ -10,15 +10,10 @@ const TdsBreadcrumbs$1 = /*@__PURE__*/ proxyCustomElement(class TdsBreadcrumbs e
10
10
  this.__attachShadow();
11
11
  this.tdsAriaLabel = undefined;
12
12
  }
13
- connectedCallback() {
14
- if (!this.tdsAriaLabel) {
15
- console.warn('Tegel Breadcrumbs component: missing tdsAriaLabel prop');
16
- }
17
- }
18
13
  render() {
19
14
  var _a;
20
15
  (_a = this.host.children[this.host.children.length - 1]) === null || _a === void 0 ? void 0 : _a.classList.add('last');
21
- return (h("nav", { key: 'fe6eaf7da192518c8f5078ac07082ac437b4aa9d', "aria-label": this.tdsAriaLabel }, h("div", { key: 'a33b2f1de081eff02a6101177cc72a899a81bbff', role: "list", class: "tds-breadcrumb" }, h("slot", { key: '0e7a03715689f66c35f1109d301b42694254c864' }))));
16
+ return (h("nav", { key: 'd79f99fbdf47a75d66376c7900a1ba2ccfad0ef2', "aria-label": this.tdsAriaLabel }, h("div", { key: 'c06fa49904e230b1fcbaa8eeba1e2d6059f4eccd', role: "list", class: "tds-breadcrumb" }, h("slot", { key: 'fd44b69cd45ffaed95c865988832fa56c545125c' }))));
22
17
  }
23
18
  get host() { return this; }
24
19
  static get style() { return TdsBreadcrumbsStyle0; }
@@ -21,11 +21,6 @@ const TdsButton$1 = /*@__PURE__*/ proxyCustomElement(class TdsButton extends H {
21
21
  this.value = undefined;
22
22
  this.onlyIcon = false;
23
23
  }
24
- connectedCallback() {
25
- if (this.onlyIcon && !this.tdsAriaLabel) {
26
- console.warn('Tegel button component: please specify the tdsAriaLabel prop when you have the onlyIcon attribute set to true');
27
- }
28
- }
29
24
  handleKeyDown(event) {
30
25
  if (event.key === 'Enter' && !this.disabled) {
31
26
  this.host.querySelector('button').classList.add('active');
@@ -42,11 +37,11 @@ const TdsButton$1 = /*@__PURE__*/ proxyCustomElement(class TdsButton extends H {
42
37
  if (!this.text && !hasLabelSlot) {
43
38
  this.onlyIcon = true;
44
39
  }
45
- return (h(Host, { key: '37c42e8c220b689445940a8dc863e24b46daa4f5', class: {
40
+ return (h(Host, { key: '7358240d76e1b7a6df238b2a1e5f1702f9cd33d7', class: {
46
41
  [`tds-mode-variant-${this.modeVariant}`]: Boolean(this.modeVariant),
47
42
  disabled: Boolean(this.disabled),
48
43
  fullbleed: Boolean(this.fullbleed),
49
- }, disabled: this.disabled }, h("button", Object.assign({ key: 'aa4a32c29d10f66ff37e1b6c6ab4381a587c89d7', type: this.type, name: this.name ? this.name : undefined, value: this.value ? this.value : undefined, disabled: this.disabled, class: {
44
+ }, disabled: this.disabled }, h("button", Object.assign({ key: '971f814b0b832e9b161c77812fb7668ed34312ab', type: this.type, name: this.name ? this.name : undefined, value: this.value ? this.value : undefined, disabled: this.disabled, class: {
50
45
  'primary': this.variant === 'primary',
51
46
  'secondary': this.variant === 'secondary',
52
47
  'ghost': this.variant === 'ghost',
@@ -60,7 +55,7 @@ const TdsButton$1 = /*@__PURE__*/ proxyCustomElement(class TdsButton extends H {
60
55
  'icon': hasIconSlot,
61
56
  'only-icon': this.onlyIcon,
62
57
  [`animation-${this.animation}`]: this.animation !== 'none',
63
- } }, (this.onlyIcon && this.tdsAriaLabel && { 'aria-label': this.tdsAriaLabel })), this.text, hasLabelSlot && !this.onlyIcon && h("slot", { key: '4b6fa14e76d9952fd48566e51196717b741e639b', name: "label" }), hasIconSlot && h("slot", { key: '7e922832ce9f28a4181d38dbfec4906a6ccb6c48', name: "icon" }))));
58
+ } }, (this.onlyIcon && this.tdsAriaLabel && { 'aria-label': this.tdsAriaLabel })), this.text, hasLabelSlot && !this.onlyIcon && h("slot", { key: '2dc9400b032af40765d7ba1add85c09249dea64b', name: "label" }), hasIconSlot && h("slot", { key: '01af3eeaa00abc5dc824f4fa4633b2460fb4fe46', name: "icon" }))));
64
59
  }
65
60
  get host() { return this; }
66
61
  static get style() { return TdsButtonStyle0; }
@@ -1,4 +1,4 @@
1
- import { T as TdsCheckbox$1, d as defineCustomElement$1 } from './p-23aab3b9.js';
1
+ import { T as TdsCheckbox$1, d as defineCustomElement$1 } from './p-44f5b5e1.js';
2
2
 
3
3
  const TdsCheckbox = TdsCheckbox$1;
4
4
  const defineCustomElement = defineCustomElement$1;
@@ -72,11 +72,6 @@ const TdsChip$1 = /*@__PURE__*/ proxyCustomElement(class TdsChip extends H {
72
72
  }
73
73
  return Object.assign(Object.assign({}, commonAttributes), { onClick: () => this.handleClick() });
74
74
  }
75
- connectedCallback() {
76
- if (!this.tdsAriaLabel) {
77
- console.warn('Tegel Chip component: tdsAriaLabel prop is missing');
78
- }
79
- }
80
75
  render() {
81
76
  const inputAttributes = this.renderInputAttributes();
82
77
  const hasPrefixSlot = hasSlot('prefix', this.host);
@@ -90,7 +85,7 @@ const TdsChip$1 = /*@__PURE__*/ proxyCustomElement(class TdsChip extends H {
90
85
  'suffix': hasSuffixSlot,
91
86
  'disabled': this.disabled,
92
87
  };
93
- return (h(Host, { key: 'bec32d74f1e0a42f98fb431d5988ba1d78c57b43' }, h("div", { key: 'af67d86bbf22be341cc816d72dad135cf04a9002', class: "component" }, h("div", { key: 'ee91bc58ca35ba6307e270f63bbb3da65e16b4f9', class: chipClasses }, h("input", Object.assign({ key: 'a5e723793a8f8c749f6d54937bbde888788115e0', type: this.type, id: this.chipId, "aria-checked": this.type === 'button' ? undefined : String(this.checked), role: this.type, "aria-label": this.tdsAriaLabel }, inputAttributes)), h("label", { key: 'f0a219c8f5c462e3ec626551aeea054ead479d2b', onClick: (event) => event.stopPropagation(), htmlFor: this.chipId }, hasPrefixSlot && h("slot", { key: '9169b3a496fa6648873811a3ca9eb5d51d110a6f', name: "prefix" }), hasLabelSlot && h("slot", { key: '932e06fe8be85d7588d11024ebc87000c887e9c0', name: "label" }), hasSuffixSlot && h("slot", { key: '3f159f17de790ec17b64a596b9f88dbbda7d1429', name: "suffix" }))))));
88
+ return (h(Host, { key: '4a498e81dbdd096e01d502a1bc378bfa9f7ea61d' }, h("div", { key: '441e76b25ec9fb91485f3394e6df08fa2ac0363f', class: "component" }, h("div", { key: '88658da3bae225792261b6b3b7796c514d76e665', class: chipClasses }, h("input", Object.assign({ key: '1e495bd583136ba481b7f11891f008c8584b0b38', type: this.type, id: this.chipId, "aria-checked": this.type === 'button' ? undefined : String(this.checked), role: this.type, "aria-label": this.tdsAriaLabel }, inputAttributes)), h("label", { key: 'ffaff7dd33befe64eb69fc6f786efd38eb654628', onClick: (event) => event.stopPropagation(), htmlFor: this.chipId }, hasPrefixSlot && h("slot", { key: '95a6bf9c4d337a9d9caaf66b598615af657045c3', name: "prefix" }), hasLabelSlot && h("slot", { key: '2e732390348814bbeea2bb0c4c5fa0b9206a6578', name: "label" }), hasSuffixSlot && h("slot", { key: '716254ff0b5995b2d2a99dcd2aaa2f94613255d0', name: "suffix" }))))));
94
89
  }
95
90
  get host() { return this; }
96
91
  static get style() { return TdsChipStyle0; }
@@ -114,11 +114,6 @@ const TdsDatetime$1 = /*@__PURE__*/ proxyCustomElement(class TdsDatetime extends
114
114
  }
115
115
  this.value = value;
116
116
  }
117
- connectedCallback() {
118
- if (!this.tdsAriaLabel && !this.label) {
119
- console.warn('Tegel Datetime component: provide the label or tdsAriaLabel prop for improved accessibility');
120
- }
121
- }
122
117
  render() {
123
118
  let className = ' tds-datetime-input';
124
119
  if (this.size === 'md') {
@@ -139,7 +134,7 @@ const TdsDatetime$1 = /*@__PURE__*/ proxyCustomElement(class TdsDatetime extends
139
134
  'tds-datetime-container-label-inside': this.label && this.labelPosition === 'inside' && this.size !== 'sm',
140
135
  };
141
136
  const iphone = navigator.userAgent.toLowerCase().includes('iphone');
142
- return (h("div", { key: '28c414fb800bb7e1411feb93b03b4ec4732e60fb', class: classNames, onKeyDown: (e) => {
137
+ return (h("div", { key: 'f397a4fc034fb7cd4dcb8ed7b0cbf2ab2e51177a', class: classNames, onKeyDown: (e) => {
143
138
  if (e.key === 'Enter') {
144
139
  const browserIsChrome = navigator.userAgent.toLowerCase().includes('chrome');
145
140
  if (browserIsChrome) {
@@ -147,9 +142,9 @@ const TdsDatetime$1 = /*@__PURE__*/ proxyCustomElement(class TdsDatetime extends
147
142
  this.textInput.showPicker();
148
143
  }
149
144
  }
150
- } }, this.labelPosition === 'outside' && this.label && (h("label", { key: '8498489db26eeffef963d57dd8aaaa27903e3e98', htmlFor: this.name, class: "tds-datetime-label" }, this.label)), h("div", { key: 'e62f09d543d12a3d9578bee5249171c85c7e3f03', onClick: (e) => this.handleFocusClick(e), class: "tds-datetime-container" }, h("div", { key: '0d083993b8f447918d0110ba78f18586d5afac1c', class: `tds-datetime-input-container type-${this.type}` }, h("input", { key: 'cdec8e9e1c8f355858031f34799fac7dd8d03c4b', ref: (inputEl) => {
145
+ } }, this.labelPosition === 'outside' && this.label && (h("label", { key: 'e5dd50563ed2d464983016bc608d81b77c379add', htmlFor: this.name, class: "tds-datetime-label" }, this.label)), h("div", { key: 'b2c01f96bb7d8fa7279ac27048328204cc249547', onClick: (e) => this.handleFocusClick(e), class: "tds-datetime-container" }, h("div", { key: 'e7002fc416e62d2c93c337aee1869aa817997df9', class: `tds-datetime-input-container type-${this.type}` }, h("input", { key: '3fdf8d55b15f5a00d4fb0755d5774fee93f100b9', ref: (inputEl) => {
151
146
  this.textInput = inputEl;
152
- }, class: className, type: this.type, disabled: this.disabled, value: this.value, min: this.min, max: this.max, autofocus: this.autofocus, name: this.name, id: this.name, onInput: (e) => this.handleInput(e), onBlur: (e) => this.handleBlur(e), onChange: (e) => this.handleChange(e), "aria-label": this.tdsAriaLabel ? this.tdsAriaLabel : this.label }), this.labelPosition === 'inside' && this.size !== 'sm' && this.label && (h("label", { key: 'f5ab00bd2a3dca4a46981da7e54ff6dcacfb6529', class: `tds-datetime-label-inside ${iphone && 'iphone'}`, htmlFor: this.name }, this.label)), h("div", { key: 'ce7799142c01703e7d3add1bc3d0fb474dec25e3', class: "datetime-icon icon-datetime-local" }, h("tds-icon", { key: '189b60ff034d2e0bc49e9461fc9970846a7e10a2', size: "20px", name: "calendar", svgTitle: "Calendar" })), h("div", { key: '192c46c706e8d8ca8613e832df2f77e981b64e2a', class: "datetime-icon icon-time" }, h("tds-icon", { key: 'e0cb4c98ccd40cb6d5b82d313aa48da8e4564b57', size: "20px", name: "clock", svgTitle: "Clock" }))), h("div", { key: '5a677ae45553060d459e1002741c0bed7ae1cefa', class: "tds-datetime-bar" })), this.helper && (h("div", { key: '0b132b2f580c3dffcfceff2ba8b4c2315ca8cd50', class: "tds-datetime-helper" }, h("div", { key: 'b17e1f96757072c8092e4cbe6e66b45b209a16ae', class: "tds-helper" }, this.state === 'error' && h("tds-icon", { key: '8afde58643e719da112bad1dcdc47f363c85490c', name: "error", size: "16px", svgTitle: "error" }), this.helper)))));
147
+ }, class: className, type: this.type, disabled: this.disabled, value: this.value, min: this.min, max: this.max, autofocus: this.autofocus, name: this.name, id: this.name, onInput: (e) => this.handleInput(e), onBlur: (e) => this.handleBlur(e), onChange: (e) => this.handleChange(e), "aria-label": this.tdsAriaLabel ? this.tdsAriaLabel : this.label }), this.labelPosition === 'inside' && this.size !== 'sm' && this.label && (h("label", { key: '48d096356ad9f547bacbf407af12c4411d5dd45f', class: `tds-datetime-label-inside ${iphone && 'iphone'}`, htmlFor: this.name }, this.label)), h("div", { key: '0ea83c4003923ffed9b11ef22131000bb696a80f', class: "datetime-icon icon-datetime-local" }, h("tds-icon", { key: '6ab6fde60c3d8ce0ad212c0d248c597a23cc6ce7', size: "20px", name: "calendar", svgTitle: "Calendar" })), h("div", { key: '4c304db3c9e6159a7827b6a83c6f81d04cbf0d19', class: "datetime-icon icon-time" }, h("tds-icon", { key: '2a91a579dc5307d35ffbd47aa67616e2e692dd1c', size: "20px", name: "clock", svgTitle: "Clock" }))), h("div", { key: '80dec676d32fd856e7a7dcee7b7e6acbb8b66827', class: "tds-datetime-bar" })), this.helper && (h("div", { key: 'ff276d3c174c88c14081d7a5da689c278844422a', class: "tds-datetime-helper" }, h("div", { key: '9401ca569dd8c23e1bcbdccb39d9f8134fc027db', class: "tds-helper" }, this.state === 'error' && h("tds-icon", { key: 'dada47e75f30dac9b132477ffd73720d0e1a7530', name: "error", size: "16px", svgTitle: "error" }), this.helper)))));
153
148
  }
154
149
  static get style() { return TdsDatetimeStyle0; }
155
150
  }, [2, "tds-datetime", {
@@ -1,4 +1,4 @@
1
- import { T as TdsDropdownOption$1, d as defineCustomElement$1 } from './p-19edd11a.js';
1
+ import { T as TdsDropdownOption$1, d as defineCustomElement$1 } from './p-d64878cb.js';
2
2
 
3
3
  const TdsDropdownOption = TdsDropdownOption$1;
4
4
  const defineCustomElement = defineCustomElement$1;
@@ -1,4 +1,4 @@
1
- import { T as TdsDropdown$1, d as defineCustomElement$1 } from './p-ffbaebb1.js';
1
+ import { T as TdsDropdown$1, d as defineCustomElement$1 } from './p-c0066f2a.js';
2
2
 
3
3
  const TdsDropdown = TdsDropdown$1;
4
4
  const defineCustomElement = defineCustomElement$1;
@@ -1,6 +1,5 @@
1
1
  import { p as proxyCustomElement, H, h, c as Host } from './p-28ef5186.js';
2
2
  import { g as generateUniqueId } from './p-11648030.js';
3
- import { h as hasSlot } from './p-ae110fc2.js';
4
3
  import { d as defineCustomElement$6 } from './p-9ad61cb5.js';
5
4
  import { d as defineCustomElement$5 } from './p-6adb1ce3.js';
6
5
  import { d as defineCustomElement$4 } from './p-b390ece5.js';
@@ -54,20 +53,14 @@ const TdsHeaderDropdown$1 = /*@__PURE__*/ proxyCustomElement(class TdsHeaderDrop
54
53
  });
55
54
  }
56
55
  }
57
- connectedCallback() {
58
- const hasLabelSlot = hasSlot('label', this.host);
59
- if (!this.tdsAriaLabel && !hasLabelSlot) {
60
- console.warn('Tegel Header Dropdown component: use label slot or specify tdsAriaLabel prop');
61
- }
62
- }
63
56
  render() {
64
- return (h(Host, { key: '6ab1d0f1d475d6d0a486e1909cad300d89eb39a0' }, h("div", { key: 'bfe11cdc8c2bf592cec7f3cf8888555071781afe', class: {
57
+ return (h(Host, { key: 'd3f0a943b953783f2fc1c6345563a5adf0ded1dd' }, h("div", { key: 'c7028ceb31b9409d76d3663cd92a1fb3fa68fd7e', class: {
65
58
  'state-open': this.open,
66
- } }, h("tds-header-item", { key: '27b6d2680858443a26d7108b5318386df76db788', class: "button", active: this.open, selected: this.selected }, h("button", { key: '09d0ccb3bc5a31a897af65f5fcf4d47ee8b35192', ref: (el) => {
59
+ } }, h("tds-header-item", { key: 'f1d5fe99ee0b62316dd0b48c9b5bb04439fb9b12', class: "button", active: this.open, selected: this.selected }, h("button", { key: '0e1437b558782c96e984287bfc0b9f301090bdb0', ref: (el) => {
67
60
  this.buttonEl = el;
68
61
  }, "aria-expanded": `${this.open}`, "aria-controls": `launcher-${this.uuid}`, "aria-current": this.selected ? 'location' : 'false', onClick: () => {
69
62
  this.toggleDropdown();
70
- }, "aria-label": this.tdsAriaLabel }, h("slot", { key: '50c872c297116ece9dd5da41398aac3bd88cd529', name: "icon" }), this.label, h("slot", { key: '141a43cdc4c8aeade4d547bbb91a28f62542bb98', name: "label" }), !this.noDropdownIcon && (h("tds-icon", { key: '13f2f8d6b264f09dea45e9b7809adab1b83db683', class: "dropdown-icon", name: "chevron_down", size: "16px", svgTitle: "Dropdown icon" })))), this.buttonEl && (h("tds-popover-canvas", { key: '10b18c15ae1d2c0fbafaa82bed4ae7759c857c54', id: `tds-dropdown-${this.uuid}`, class: "menu", referenceEl: this.buttonEl, placement: "bottom-start", show: this.open, offsetDistance: 0, modifiers: [
63
+ }, "aria-label": this.tdsAriaLabel }, h("slot", { key: 'fc63cfe2414eb2c60fe85e481a3af49af3ce9653', name: "icon" }), this.label, h("slot", { key: 'f302406472c7be0223fa17b76cc2674cb3e148b7', name: "label" }), !this.noDropdownIcon && (h("tds-icon", { key: '32c53b88ffeed4a78f9efc77b5976afe190c86c6', class: "dropdown-icon", name: "chevron_down", size: "16px", svgTitle: "Dropdown icon" })))), this.buttonEl && (h("tds-popover-canvas", { key: '86ed4a3140d80521792b2953bc4acdef9476c3f6', id: `tds-dropdown-${this.uuid}`, class: "menu", referenceEl: this.buttonEl, placement: "bottom-start", show: this.open, offsetDistance: 0, modifiers: [
71
64
  {
72
65
  name: 'flip',
73
66
  options: {