@scania/tegel 1.23.0-value-prop.beta.2 → 1.23.0-value-prop.beta.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (64) hide show
  1. package/dist/cjs/loader.cjs.js +1 -1
  2. package/dist/cjs/tds-block.cjs.entry.js +17 -13
  3. package/dist/cjs/tds-checkbox.cjs.entry.js +9 -2
  4. package/dist/cjs/tds-dropdown_2.cjs.entry.js +50 -33
  5. package/dist/cjs/tds-link.cjs.entry.js +5 -3
  6. package/dist/cjs/tds-popover-core.cjs.entry.js +1 -1
  7. package/dist/cjs/tds-slider.cjs.entry.js +33 -7
  8. package/dist/cjs/tegel.cjs.js +1 -1
  9. package/dist/collection/components/block/block.css +11 -5
  10. package/dist/collection/components/block/block.js +16 -12
  11. package/dist/collection/components/checkbox/checkbox.js +19 -3
  12. package/dist/collection/components/dropdown/dropdown.js +50 -33
  13. package/dist/collection/components/link/link.css +7 -1
  14. package/dist/collection/components/link/link.js +22 -2
  15. package/dist/collection/components/popover-core/tds-popover-core.css +36 -29
  16. package/dist/collection/components/slider/slider.js +34 -8
  17. package/dist/components/{p-e02b091c.js → p-5e1a9abc.js} +1 -1
  18. package/dist/components/{p-dcfecf4d.js → p-aea7fa6b.js} +1 -1
  19. package/dist/components/{p-4d8f8d5c.js → p-d8c96665.js} +50 -33
  20. package/dist/components/{p-e4d7c655.js → p-d921fe75.js} +10 -3
  21. package/dist/components/{p-462b77e8.js → p-e7868876.js} +1 -1
  22. package/dist/components/tds-block.js +17 -13
  23. package/dist/components/tds-checkbox.js +1 -1
  24. package/dist/components/tds-dropdown-option.js +1 -1
  25. package/dist/components/tds-dropdown.js +1 -1
  26. package/dist/components/tds-header-dropdown.js +2 -2
  27. package/dist/components/tds-header-launcher.js +2 -2
  28. package/dist/components/tds-link.js +7 -4
  29. package/dist/components/tds-popover-canvas.js +1 -1
  30. package/dist/components/tds-popover-core.js +1 -1
  31. package/dist/components/tds-popover-menu.js +1 -1
  32. package/dist/components/tds-slider.js +33 -7
  33. package/dist/components/tds-table-body-row.js +1 -1
  34. package/dist/components/tds-table-footer.js +3 -3
  35. package/dist/components/tds-table-header.js +1 -1
  36. package/dist/components/tds-tooltip.js +1 -1
  37. package/dist/esm/loader.js +1 -1
  38. package/dist/esm/tds-block.entry.js +17 -13
  39. package/dist/esm/tds-checkbox.entry.js +9 -2
  40. package/dist/esm/tds-dropdown_2.entry.js +50 -33
  41. package/dist/esm/tds-link.entry.js +5 -3
  42. package/dist/esm/tds-popover-core.entry.js +1 -1
  43. package/dist/esm/tds-slider.entry.js +34 -8
  44. package/dist/esm/tegel.js +1 -1
  45. package/dist/tegel/p-2557b79b.entry.js +1 -0
  46. package/dist/tegel/{p-590b5f55.entry.js → p-4e3e2601.entry.js} +1 -1
  47. package/dist/tegel/p-5bc85f3e.entry.js +1 -0
  48. package/dist/tegel/p-6a52ed63.entry.js +1 -0
  49. package/dist/tegel/p-9aefb942.entry.js +1 -0
  50. package/dist/tegel/p-e97a2700.entry.js +1 -0
  51. package/dist/tegel/tegel.css +2 -2
  52. package/dist/tegel/tegel.esm.js +1 -1
  53. package/dist/types/components/block/block.d.ts +1 -2
  54. package/dist/types/components/checkbox/checkbox.d.ts +2 -0
  55. package/dist/types/components/dropdown/dropdown.d.ts +3 -0
  56. package/dist/types/components/link/link.d.ts +2 -0
  57. package/dist/types/components/slider/slider.d.ts +7 -0
  58. package/dist/types/components.d.ts +8 -0
  59. package/package.json +1 -1
  60. package/dist/tegel/p-0c05887d.entry.js +0 -1
  61. package/dist/tegel/p-a464920f.entry.js +0 -1
  62. package/dist/tegel/p-c3513f1f.entry.js +0 -1
  63. package/dist/tegel/p-db00f607.entry.js +0 -1
  64. package/dist/tegel/p-f91c6e9d.entry.js +0 -1
@@ -1,6 +1,6 @@
1
1
  import { p as proxyCustomElement, H, h, c as Host } from './p-28ef5186.js';
2
2
  import { i as inheritAttributes } from './p-3fe9cbbf.js';
3
- import { d as defineCustomElement$1 } from './p-e02b091c.js';
3
+ import { d as defineCustomElement$1 } from './p-5e1a9abc.js';
4
4
 
5
5
  const popoverCanvasCss = ".tds-popover-canvas.sc-tds-popover-canvas{box-sizing:border-box;display:inline-block;color:var(--tds-popover-canvas-color);background-color:var(--tds-popover-canvas-background);box-shadow:0 3px 3px rgba(0, 0, 0, 0.15), 0 -1px 1px rgba(0, 0, 0, 0.1);border-radius:4px;z-index:900}.tds-popover-canvas.sc-tds-popover-canvas *.sc-tds-popover-canvas{box-sizing:border-box}";
6
6
  const TdsPopoverCanvasStyle0 = popoverCanvasCss;
@@ -90,12 +90,12 @@ const TdsDropdown = /*@__PURE__*/ proxyCustomElement(class TdsDropdown extends H
90
90
  return tdsDropdownOptions;
91
91
  };
92
92
  this.getSelectedChildren = () => {
93
- if (!this.value)
93
+ if (this.selectedOptions.length === 0)
94
94
  return [];
95
- const valueArray = Array.isArray(this.value) ? this.value : [this.value];
96
- return valueArray
95
+ return this.selectedOptions
97
96
  .map((stringValue) => {
98
- const matchingElement = this.getChildren().find((element) => element.value === stringValue);
97
+ var _a;
98
+ const matchingElement = (_a = this.getChildren()) === null || _a === void 0 ? void 0 : _a.find((element) => element.value === stringValue);
99
99
  return matchingElement;
100
100
  })
101
101
  .filter(Boolean);
@@ -112,13 +112,11 @@ const TdsDropdown = /*@__PURE__*/ proxyCustomElement(class TdsDropdown extends H
112
112
  return labels === null || labels === void 0 ? void 0 : labels.join(', ');
113
113
  };
114
114
  this.setValueAttribute = () => {
115
- var _a;
116
- if (!this.value || ((_a = this.value) === null || _a === void 0 ? void 0 : _a.toString()) === '') {
115
+ if (this.selectedOptions.length === 0) {
117
116
  this.host.removeAttribute('value');
118
117
  }
119
118
  else {
120
- const valueArray = Array.isArray(this.value) ? this.value : [this.value];
121
- this.host.setAttribute('value', valueArray.map((val) => val).toString());
119
+ this.host.setAttribute('value', this.selectedOptions.join(','));
122
120
  }
123
121
  };
124
122
  this.getOpenDirection = () => {
@@ -176,8 +174,10 @@ const TdsDropdown = /*@__PURE__*/ proxyCustomElement(class TdsDropdown extends H
176
174
  this.handleFilterReset = () => {
177
175
  this.reset();
178
176
  this.inputElement.value = '';
179
- this.handleFilter({ target: { value: this.inputElement.value } });
177
+ this.handleFilter({ target: { value: '' } });
180
178
  this.inputElement.focus();
179
+ // Add this line to ensure internal value is cleared
180
+ this.internalValue = '';
181
181
  };
182
182
  this.handleFocus = (event) => {
183
183
  this.open = true;
@@ -191,6 +191,12 @@ const TdsDropdown = /*@__PURE__*/ proxyCustomElement(class TdsDropdown extends H
191
191
  this.handleBlur = (event) => {
192
192
  this.tdsBlur.emit(event);
193
193
  };
194
+ this.resetInput = () => {
195
+ const inputEl = this.host.querySelector('input');
196
+ if (inputEl) {
197
+ this.reset();
198
+ }
199
+ };
194
200
  this.name = undefined;
195
201
  this.disabled = false;
196
202
  this.helper = undefined;
@@ -225,6 +231,10 @@ const TdsDropdown = /*@__PURE__*/ proxyCustomElement(class TdsDropdown extends H
225
231
  normalizeValue(value) {
226
232
  if (!value)
227
233
  return [];
234
+ // For multiselect, keep array. For single select, wrap in array
235
+ if (this.multiselect) {
236
+ return Array.isArray(value) ? value : value.split(',');
237
+ }
228
238
  return Array.isArray(value) ? value : [value];
229
239
  }
230
240
  hasValueChanged(newValue, currentValue) {
@@ -235,6 +245,8 @@ const TdsDropdown = /*@__PURE__*/ proxyCustomElement(class TdsDropdown extends H
235
245
  updateDropdownState(values) {
236
246
  // Update internal state
237
247
  this.selectedOptions = this.validateValues(values);
248
+ // Then update the value prop to match
249
+ this.value = this.multiselect ? this.selectedOptions : this.selectedOptions[0] || null;
238
250
  // Update DOM
239
251
  this.updateOptionElements();
240
252
  // Update display value
@@ -267,8 +279,6 @@ const TdsDropdown = /*@__PURE__*/ proxyCustomElement(class TdsDropdown extends H
267
279
  }
268
280
  }
269
281
  emitChange() {
270
- // Update the value prop to match validated state
271
- this.value = this.multiselect ? this.selectedOptions : this.selectedOptions[0] || null;
272
282
  const value = this.multiselect
273
283
  ? this.selectedOptions.join(',')
274
284
  : this.selectedOptions[0] || null;
@@ -278,22 +288,19 @@ const TdsDropdown = /*@__PURE__*/ proxyCustomElement(class TdsDropdown extends H
278
288
  });
279
289
  }
280
290
  async setValue(value) {
281
- this.value = value;
291
+ const normalizedValue = this.normalizeValue(value);
292
+ this.updateDropdownState(normalizedValue);
282
293
  return this.getSelectedChildren().map((element) => ({
283
294
  value: element.value,
284
295
  label: element.textContent.trim(),
285
296
  }));
286
297
  }
287
298
  async reset() {
288
- this.value = this.multiselect ? [] : null;
299
+ this.updateDropdownState([]);
289
300
  }
290
301
  async removeValue(oldValue) {
291
- if (this.multiselect && Array.isArray(this.value)) {
292
- this.value = this.value.filter((v) => v !== oldValue);
293
- }
294
- else {
295
- this.value = null;
296
- }
302
+ const newValues = this.selectedOptions.filter((v) => v !== oldValue);
303
+ this.updateDropdownState(newValues);
297
304
  }
298
305
  /** Method that forces focus on the input element. */
299
306
  async focusElement() {
@@ -347,15 +354,15 @@ const TdsDropdown = /*@__PURE__*/ proxyCustomElement(class TdsDropdown extends H
347
354
  handleOpenState() {
348
355
  if (this.filter && this.multiselect) {
349
356
  if (!this.open) {
350
- this.inputElement.value = this.getValue();
357
+ this.inputElement.value = this.selectedOptions.length ? this.getValue() : '';
351
358
  }
352
359
  }
353
360
  }
354
361
  componentWillLoad() {
355
362
  if (this.defaultValue && !this.value) {
356
- this.value = this.defaultValue;
363
+ const initialValue = this.multiselect ? this.defaultValue.split(',') : [this.defaultValue];
364
+ this.updateDropdownState(initialValue);
357
365
  }
358
- this.setDefaultOption();
359
366
  }
360
367
  /** Method to handle slot changes */
361
368
  handleSlotChange() {
@@ -367,17 +374,27 @@ const TdsDropdown = /*@__PURE__*/ proxyCustomElement(class TdsDropdown extends H
367
374
  }
368
375
  async appendValue(value) {
369
376
  if (this.multiselect) {
370
- this.value = Array.isArray(this.value) ? [...this.value, value] : [value];
377
+ this.updateDropdownState([...this.selectedOptions, value]);
371
378
  }
372
379
  else {
373
- this.value = value;
380
+ this.updateDropdownState([value]);
381
+ }
382
+ }
383
+ componentDidRender() {
384
+ const form = this.host.closest('form');
385
+ if (form) {
386
+ form.addEventListener('reset', this.resetInput);
387
+ }
388
+ }
389
+ disconnectedCallback() {
390
+ const form = this.host.closest('form');
391
+ if (form) {
392
+ form.removeEventListener('reset', this.resetInput);
374
393
  }
375
394
  }
376
395
  render() {
377
- var _a, _b, _c;
378
- const valueArray = Array.isArray(this.value) ? this.value : this.value ? [this.value] : [];
379
- appendHiddenInput(this.host, this.name, valueArray.map((value) => value).toString(), this.disabled);
380
- return (h(Host, { key: 'c3a3742ba6f875aee1b9e7abb4ab2c2b2331d3fc', role: "select", class: `${this.modeVariant ? `tds-mode-variant-${this.modeVariant}` : ''}` }, this.label && this.labelPosition === 'outside' && (h("div", { key: '0b45d4e910577e1cfd350f6f60e544839f905865', class: `label-outside ${this.disabled ? 'disabled' : ''}` }, this.label)), h("div", { key: '3557975c254df99c9f97dac71a6d9e66268c09f2', class: `dropdown-select ${this.size} ${this.disabled ? 'disabled' : ''}` }, this.filter ? (h("div", { class: {
396
+ appendHiddenInput(this.host, this.name, this.selectedOptions.join(','), this.disabled);
397
+ return (h(Host, { key: '198e38f89945016a0305584262b751053a00ac2e', role: "select", class: `${this.modeVariant ? `tds-mode-variant-${this.modeVariant}` : ''}` }, this.label && this.labelPosition === 'outside' && (h("div", { key: 'f785bd85282f653e9da367ced8aac22b62061b6d', class: `label-outside ${this.disabled ? 'disabled' : ''}` }, this.label)), h("div", { key: '9a93fa9b9c343bb748de3324cf3fda0839d24b5b', class: `dropdown-select ${this.size} ${this.disabled ? 'disabled' : ''}` }, this.filter ? (h("div", { class: {
381
398
  filter: true,
382
399
  focus: this.filterFocus,
383
400
  disabled: this.disabled,
@@ -385,7 +402,7 @@ const TdsDropdown = /*@__PURE__*/ proxyCustomElement(class TdsDropdown extends H
385
402
  } }, h("div", { class: "value-wrapper" }, this.label && this.labelPosition === 'inside' && this.placeholder && (h("div", { class: `label-inside ${this.size}` }, this.label)), this.label && this.labelPosition === 'inside' && !this.placeholder && (h("div", { class: `
386
403
  label-inside-as-placeholder
387
404
  ${this.size}
388
- ${((_a = this.value) === null || _a === void 0 ? void 0 : _a.length) ? 'selected' : ''}
405
+ ${this.selectedOptions.length ? 'selected' : ''}
389
406
  ` }, this.label)), h("input", {
390
407
  // eslint-disable-next-line no-return-assign
391
408
  ref: (inputEl) => (this.inputElement = inputEl), class: `${this.labelPosition === 'inside' ? 'placeholder' : ''}`, type: "text", placeholder: this.filterFocus ? '' : this.placeholder, value: this.multiselect && this.filterFocus ? '' : this.getValue(), disabled: this.disabled, onInput: (event) => this.handleFilter(event), onBlur: (event) => {
@@ -412,14 +429,14 @@ const TdsDropdown = /*@__PURE__*/ proxyCustomElement(class TdsDropdown extends H
412
429
  this.open = false;
413
430
  }
414
431
  }, class: `
415
- ${this.value ? 'value' : 'placeholder'}
432
+ ${this.selectedOptions.length ? 'value' : 'placeholder'}
416
433
  ${this.open ? 'open' : 'closed'}
417
434
  ${this.error ? 'error' : ''}
418
435
  `, disabled: this.disabled }, h("div", { class: `value-wrapper ${this.size}` }, this.label && this.labelPosition === 'inside' && this.placeholder && (h("div", { class: `label-inside ${this.size}` }, this.label)), this.label && this.labelPosition === 'inside' && !this.placeholder && (h("div", { class: `
419
436
  label-inside-as-placeholder
420
437
  ${this.size}
421
- ${((_b = this.value) === null || _b === void 0 ? void 0 : _b.length) ? 'selected' : ''}
422
- ` }, this.label)), h("div", { class: `placeholder ${this.size}` }, ((_c = this.value) === null || _c === void 0 ? void 0 : _c.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: 'bf74f7277ac93324469c9f371a1a41598366d833', ref: (element) => (this.dropdownList = element), class: {
438
+ ${this.selectedOptions.length ? 'selected' : ''}
439
+ ` }, 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: '38ea3153aa17144d03c3472600f7c22b9e7d1ee8', ref: (element) => (this.dropdownList = element), class: {
423
440
  'dropdown-list': true,
424
441
  [this.size]: true,
425
442
  [this.getOpenDirection()]: true,
@@ -428,7 +445,7 @@ const TdsDropdown = /*@__PURE__*/ proxyCustomElement(class TdsDropdown extends H
428
445
  'closed': !this.open,
429
446
  [`animation-enter-${this.animation}`]: this.animation !== 'none' && this.open,
430
447
  [`animation-exit-${this.animation}`]: this.animation !== 'none' && !this.open,
431
- } }, h("slot", { key: '0bbfde317a9c9f757236f9a3aa45bc7549cba134', onSlotchange: () => this.handleSlotChange() }), this.filterResult === 0 && this.noResultText !== '' && (h("div", { key: '4a2d556e26c1aedc6aad4ec1031e5290d4d6e28a', class: `no-result ${this.size}` }, this.noResultText))), this.helper && (h("div", { key: '506b816ed70834aef3fd3e22acc19567761d2645', class: `helper ${this.error ? 'error' : ''} ${this.disabled ? 'disabled' : ''}` }, this.error && h("tds-icon", { key: 'f890f8df6431d6a437459a245711731091cbe4ad', name: "error", size: "16px" }), this.helper))));
448
+ } }, h("slot", { key: 'dfe65bc02f12a01b4ef4d710c3e8fabe68d36530', onSlotchange: () => this.handleSlotChange() }), this.filterResult === 0 && this.noResultText !== '' && (h("div", { key: '5d4d52a9dc9a1ac4c35ae62a2543c15d8f252a08', class: `no-result ${this.size}` }, this.noResultText))), this.helper && (h("div", { key: 'f48a3d2320ebe64c439127898eb4540ccd21b421', class: `helper ${this.error ? 'error' : ''} ${this.disabled ? 'disabled' : ''}` }, this.error && h("tds-icon", { key: 'ca396e64d54c1f4fe95b0407eab80e78a7249c43', name: "error", size: "16px" }), this.helper))));
432
449
  }
433
450
  get host() { return this; }
434
451
  static get watchers() { return {
@@ -49,12 +49,19 @@ const TdsCheckbox = /*@__PURE__*/ proxyCustomElement(class TdsCheckbox extends H
49
49
  handleBlur(event) {
50
50
  this.tdsBlur.emit(event);
51
51
  }
52
+ /** Listens for a reset event inside a form */
53
+ handleFormReset(event) {
54
+ if (this.host.closest('form') === event.target) {
55
+ this.checked = false;
56
+ this.indeterminate = false;
57
+ }
58
+ }
52
59
  render() {
53
- return (h("div", { key: '0efb982ab13c1d75681614675b649e010707b701', class: "tds-checkbox" }, h("input", { key: '834b29962978ea1cf7249018e6b7eea2417da5f4',
60
+ return (h("div", { key: '068b73081ab2b1b24d58fd2afd70f2b0e4308745', class: "tds-checkbox" }, h("input", { key: '97bd225b10dea56b8166ce3d5c2e4569a7dc76f9',
54
61
  // eslint-disable-next-line no-return-assign
55
62
  ref: (inputElement) => (this.inputElement = inputElement), indeterminate: this.indeterminate, "aria-checked": this.checked, "aria-required": this.required, "aria-describedby": this.host.getAttribute('aria-describedby'), "aria-labelledby": this.host.getAttribute('aria-labelledby'), 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: () => {
56
63
  this.handleChange();
57
- } }), h("label", { key: '2150346b336440768beac655de035bf470f9e492', htmlFor: this.checkboxId }, h("slot", { key: 'df61654810e46b8707709d86bae7bdfd627724ee', name: "label" }))));
64
+ } }), h("label", { key: '9cfe0411c9b26d12229de7fdb9421b333da0199c', htmlFor: this.checkboxId }, h("slot", { key: '17d2e45ddf05aa409926f3df82caab7a4f110b72', name: "label" }))));
58
65
  }
59
66
  get host() { return this; }
60
67
  static get watchers() { return {
@@ -70,7 +77,7 @@ const TdsCheckbox = /*@__PURE__*/ proxyCustomElement(class TdsCheckbox extends H
70
77
  "indeterminate": [1028],
71
78
  "value": [1],
72
79
  "toggleCheckbox": [64]
73
- }, undefined, {
80
+ }, [[4, "reset", "handleFormReset"]], {
74
81
  "indeterminate": ["handleIndeterminateState"]
75
82
  }]);
76
83
  function defineCustomElement() {
@@ -1,5 +1,5 @@
1
1
  import { p as proxyCustomElement, H, d as createEvent, h, c as Host } from './p-28ef5186.js';
2
- import { d as defineCustomElement$2 } from './p-e4d7c655.js';
2
+ import { d as defineCustomElement$2 } from './p-d921fe75.js';
3
3
  import { d as defineCustomElement$1 } from './p-18c1245b.js';
4
4
 
5
5
  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-blue-400);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{background-color:var(--tds-dropdown-option-background-hover);cursor:pointer}:host .dropdown-option:hover.disabled{background-color:var(--tds-dropdown-option-background);cursor:not-allowed}:host([hidden]){display:none}";
@@ -1,6 +1,6 @@
1
1
  import { p as proxyCustomElement, H, h } from './p-28ef5186.js';
2
2
 
3
- const blockCss = ".tds-block{box-sizing:border-box;color:var(--tds-block-color);border-radius:4px;padding:16px;font:var(--tds-body-01);letter-spacing:var(--tds-body-01-ls);background-color:var(--tds-block-background)}.tds-block *{box-sizing:border-box}.tds-mode-variant-primary{--tds-block-background:var(--tds-block-background-primary);--tds-block-background-nested:var(--tds-block-background-nested-primary)}.tds-mode-variant-secondary{--tds-block-background:var(--tds-block-background-secondary);--tds-block-background-nested:var(--tds-block-background-nested-secondary)}";
3
+ const blockCss = ".tds-block{box-sizing:border-box;color:var(--tds-block-color);background-color:var(--tds-block-background);border-radius:4px;padding:16px;font:var(--tds-body-01);letter-spacing:var(--tds-body-01-ls)}.tds-block *{box-sizing:border-box}.tds-mode-variant-primary{background-color:var(--tds-block-background-primary)}.tds-mode-variant-secondary{background-color:var(--tds-block-background-secondary)}.tds-block-even{background-color:var(--tds-block-background-even)}.tds-block-odd{background-color:var(--tds-block-background-odd)}";
4
4
  const TdsBlockStyle0 = blockCss;
5
5
 
6
6
  const TdsBlock$1 = /*@__PURE__*/ proxyCustomElement(class TdsBlock extends H {
@@ -10,21 +10,25 @@ const TdsBlock$1 = /*@__PURE__*/ proxyCustomElement(class TdsBlock extends H {
10
10
  this.__attachShadow();
11
11
  this.modeVariant = null;
12
12
  }
13
- setModeVariantOnChildBlocks() {
14
- var _a;
15
- this.children = Array.from(this.host.children).filter((item) => item.tagName === 'TDS-BLOCK');
16
- (_a = this.children) === null || _a === void 0 ? void 0 : _a.forEach((item) => {
17
- if (!this.modeVariant) {
18
- item.setAttribute('mode-variant', 'secondary');
13
+ getNestingLevel() {
14
+ let level = 0;
15
+ let parent = this.host.parentElement;
16
+ while (parent) {
17
+ if (parent.tagName.toLowerCase() === 'tds-block') {
18
+ level++;
19
19
  }
20
- else {
21
- item.setAttribute('mode-variant', this.modeVariant === 'primary' ? 'secondary' : 'primary');
22
- }
23
- });
20
+ parent = parent.parentElement;
21
+ }
22
+ return level;
24
23
  }
25
24
  render() {
26
- this.setModeVariantOnChildBlocks();
27
- return (h("div", { key: 'a40067afde48258475108cb9785555e7c2bd0a47', class: `tds-block ${this.modeVariant !== null ? `tds-mode-variant-${this.modeVariant}` : ''}` }, h("slot", { key: 'aaf62c59a3a01a0c41a594c15257e4746a049418' })));
25
+ const nestingLevel = this.getNestingLevel();
26
+ const evenOddClass = this.modeVariant === null
27
+ ? nestingLevel % 2 === 0
28
+ ? 'tds-block-even'
29
+ : 'tds-block-odd'
30
+ : '';
31
+ return (h("div", { key: '5f22f1b8ae254a577a151563deadd969e90e3d20', class: `tds-block ${evenOddClass} ${this.modeVariant !== null ? `tds-mode-variant-${this.modeVariant}` : ''}` }, h("slot", { key: '52367d3055296ebd2b6e8291786554f34253750f' })));
28
32
  }
29
33
  get host() { return this; }
30
34
  static get style() { return TdsBlockStyle0; }
@@ -1,4 +1,4 @@
1
- import { T as TdsCheckbox$1, d as defineCustomElement$1 } from './p-e4d7c655.js';
1
+ import { T as TdsCheckbox$1, d as defineCustomElement$1 } from './p-d921fe75.js';
2
2
 
3
3
  const TdsCheckbox = TdsCheckbox$1;
4
4
  const defineCustomElement = defineCustomElement$1;
@@ -1,4 +1,4 @@
1
- import { T as TdsDropdownOption$1, d as defineCustomElement$1 } from './p-462b77e8.js';
1
+ import { T as TdsDropdownOption$1, d as defineCustomElement$1 } from './p-e7868876.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-4d8f8d5c.js';
1
+ import { T as TdsDropdown$1, d as defineCustomElement$1 } from './p-d8c96665.js';
2
2
 
3
3
  const TdsDropdown = TdsDropdown$1;
4
4
  const defineCustomElement = defineCustomElement$1;
@@ -3,8 +3,8 @@ import { g as generateUniqueId } from './p-11648030.js';
3
3
  import { d as defineCustomElement$6 } from './p-30de8ac4.js';
4
4
  import { d as defineCustomElement$5 } from './p-0676aa23.js';
5
5
  import { d as defineCustomElement$4 } from './p-18c1245b.js';
6
- import { d as defineCustomElement$3 } from './p-dcfecf4d.js';
7
- import { d as defineCustomElement$2 } from './p-e02b091c.js';
6
+ import { d as defineCustomElement$3 } from './p-aea7fa6b.js';
7
+ import { d as defineCustomElement$2 } from './p-5e1a9abc.js';
8
8
 
9
9
  const headerDropdownCss = ":host{--tds-scrollbar-width-standard:thin;--tds-scrollbar-width:10px;--tds-scrollbar-height:10px;--tds-scrollbar-thumb-border-width:3px;--tds-scrollbar-thumb-border-hover-width:2px}body{scrollbar-width:thin}:host{height:var(--tds-header-height);position:relative}:host .menu{flex-direction:column;overflow-y:auto;max-height:calc(100vh - var(--tds-header-height));box-shadow:var(--tds-nav-dropdown-menu-box);background-color:var(--tds-header-app-launcher-menu-background);border-top-right-radius:0;border-top-left-radius:0}:host .menu:hover::-webkit-scrollbar-thumb{border:var(--tds-scrollbar-thumb-border-hover-width) solid transparent;background:var(--tds-scrollbar-hover-thumb-color);background-clip:padding-box}:host .menu::-webkit-scrollbar{width:var(--tds-scrollbar-width)}:host .menu::-webkit-scrollbar-track{background:var(--tds-scrollbar-track-color)}:host .menu::-webkit-scrollbar-thumb{border-radius:40px;background:var(--tds-scrollbar-thumb-color);border:var(--tds-scrollbar-thumb-border-width) solid transparent;background-clip:padding-box}:host .menu::-webkit-scrollbar-button{height:0;width:0}@supports not selector(::-webkit-scrollbar){:host .menu{scrollbar-color:var(--tds-scrollbar-thumb-color) var(--tds-scrollbar-track-color);scrollbar-width:var(--tds-scrollbar-width-standard)}}:host .state-open .dropdown-icon{transform:rotate(180deg)}:host .state-open .button{position:relative;z-index:901}";
10
10
  const TdsHeaderDropdownStyle0 = headerDropdownCss;
@@ -5,8 +5,8 @@ import { d as defineCustomElement$7 } from './p-30de8ac4.js';
5
5
  import { d as defineCustomElement$6 } from './p-0676aa23.js';
6
6
  import { d as defineCustomElement$5 } from './p-c48c68b3.js';
7
7
  import { d as defineCustomElement$4 } from './p-18c1245b.js';
8
- import { d as defineCustomElement$3 } from './p-dcfecf4d.js';
9
- import { d as defineCustomElement$2 } from './p-e02b091c.js';
8
+ import { d as defineCustomElement$3 } from './p-aea7fa6b.js';
9
+ import { d as defineCustomElement$2 } from './p-5e1a9abc.js';
10
10
 
11
11
  const headerLauncherCss = ":host{--tds-scrollbar-width-standard:thin;--tds-scrollbar-width:10px;--tds-scrollbar-height:10px;--tds-scrollbar-thumb-border-width:3px;--tds-scrollbar-thumb-border-hover-width:2px}body{scrollbar-width:thin}:host .wrapper{height:var(--tds-header-height);position:relative}:host .wrapper .menu{flex-direction:column;overflow-y:auto;max-height:calc(100vh - var(--tds-header-height));box-shadow:var(--tds-nav-dropdown-menu-box);background-color:var(--tds-header-app-launcher-menu-background);border-radius:0}:host .wrapper .menu:hover::-webkit-scrollbar-thumb{border:var(--tds-scrollbar-thumb-border-hover-width) solid transparent;background:var(--tds-scrollbar-hover-thumb-color);background-clip:padding-box}:host .wrapper .menu::-webkit-scrollbar{width:var(--tds-scrollbar-width)}:host .wrapper .menu::-webkit-scrollbar-track{background:var(--tds-scrollbar-track-color)}:host .wrapper .menu::-webkit-scrollbar-thumb{border-radius:40px;background:var(--tds-scrollbar-thumb-color);border:var(--tds-scrollbar-thumb-border-width) solid transparent;background-clip:padding-box}:host .wrapper .menu::-webkit-scrollbar-button{height:0;width:0}@supports not selector(::-webkit-scrollbar){:host .wrapper .menu{scrollbar-color:var(--tds-scrollbar-thumb-color) var(--tds-scrollbar-track-color);scrollbar-width:var(--tds-scrollbar-width-standard)}}@media all and (max-width: 384px){:host .wrapper .menu{width:100vw}}:host .wrapper.state-list-type-menu .menu{height:calc(100vh - var(--tds-header-height))}:host .wrapper.state-open .button{position:relative;z-index:901}";
12
12
  const TdsHeaderLauncherStyle0 = headerLauncherCss;
@@ -1,6 +1,6 @@
1
1
  import { p as proxyCustomElement, H, h } from './p-28ef5186.js';
2
2
 
3
- const linkCss = ":host{display:inline}:host ::slotted(*){all:unset;cursor:pointer;outline:none;color:var(--tds-link);text-decoration:underline}:host ::slotted(*:focus-visible){color:var(--tds-link-focus);text-decoration:none;outline:2px solid var(--tds-link-focus);outline-offset:-2px}:host ::slotted(*:active){color:var(--tds-link);text-decoration:underline;text-decoration-color:var(--tds-link)}:host ::slotted(*:hover){color:var(--tds-link-hover);text-decoration:underline;text-decoration-color:var(--tds-link-hover)}:host ::slotted(*:visited){color:var(--tds-link-visited);text-decoration-color:var(--tds-link-visited)}.disabled ::slotted(*){color:var(--tds-link-disabled);text-decoration-color:var(--tds-link-disabled);pointer-events:none}.no-underline ::slotted(*){text-decoration:none}.no-underline:hover ::slotted(*){text-decoration:none}";
3
+ const linkCss = ":host{display:inline}:host ::slotted(*){all:unset;cursor:pointer;outline:none;color:var(--tds-link);text-decoration:underline}:host ::slotted(*:focus-visible){color:var(--tds-link-focus);text-decoration:none;outline:2px solid var(--tds-link-focus);outline-offset:-2px}:host ::slotted(*:active){color:var(--tds-link);text-decoration:underline;text-decoration-color:var(--tds-link)}:host ::slotted(*:hover){color:var(--tds-link-hover);text-decoration:underline;text-decoration-color:var(--tds-link-hover)}:host ::slotted(*:visited){color:var(--tds-link-visited);text-decoration-color:var(--tds-link-visited)}.disabled ::slotted(*),.disabled ::slotted(*:visited){color:var(--tds-link-disabled);text-decoration-color:var(--tds-link-disabled);pointer-events:none}.no-underline ::slotted(*){text-decoration:none}.no-underline:hover ::slotted(*){text-decoration:none}.standalone ::slotted(*){font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls)}";
4
4
  const TdsLinkStyle0 = linkCss;
5
5
 
6
6
  const TdsLink$1 = /*@__PURE__*/ proxyCustomElement(class TdsLink extends H {
@@ -10,21 +10,24 @@ const TdsLink$1 = /*@__PURE__*/ proxyCustomElement(class TdsLink extends H {
10
10
  this.__attachShadow();
11
11
  this.disabled = false;
12
12
  this.underline = true;
13
+ this.standalone = false;
13
14
  }
14
15
  connectedCallback() {
15
16
  this.host.children[0].classList.add('tds-link-component');
16
17
  }
17
18
  render() {
18
- return (h("span", { key: 'd812a60488213cdd31c3ace934ae93c3b3781cf9', class: `
19
+ return (h("span", { key: '619f52601e4716a34fd39752704acf06acd94dd8', class: `
19
20
  ${this.disabled ? 'disabled' : ''}
20
21
  ${!this.underline ? 'no-underline' : ''}
21
- ` }, h("slot", { key: '2b9675a2abd7b7c16200cda28fa5ded499c03fcd' })));
22
+ ${this.standalone ? 'standalone' : ''}
23
+ ` }, h("slot", { key: '636596dae6e69aff2f10666e86fb965e46efb059' })));
22
24
  }
23
25
  get host() { return this; }
24
26
  static get style() { return TdsLinkStyle0; }
25
27
  }, [1, "tds-link", {
26
28
  "disabled": [4],
27
- "underline": [4]
29
+ "underline": [4],
30
+ "standalone": [4]
28
31
  }]);
29
32
  function defineCustomElement$1() {
30
33
  if (typeof customElements === "undefined") {
@@ -1,4 +1,4 @@
1
- import { T as TdsPopoverCanvas$1, d as defineCustomElement$1 } from './p-dcfecf4d.js';
1
+ import { T as TdsPopoverCanvas$1, d as defineCustomElement$1 } from './p-aea7fa6b.js';
2
2
 
3
3
  const TdsPopoverCanvas = TdsPopoverCanvas$1;
4
4
  const defineCustomElement = defineCustomElement$1;
@@ -1,4 +1,4 @@
1
- import { T as TdsPopoverCore$1, d as defineCustomElement$1 } from './p-e02b091c.js';
1
+ import { T as TdsPopoverCore$1, d as defineCustomElement$1 } from './p-5e1a9abc.js';
2
2
 
3
3
  const TdsPopoverCore = TdsPopoverCore$1;
4
4
  const defineCustomElement = defineCustomElement$1;
@@ -1,6 +1,6 @@
1
1
  import { p as proxyCustomElement, H, h, c as Host } from './p-28ef5186.js';
2
2
  import { i as inheritAttributes } from './p-3fe9cbbf.js';
3
- import { d as defineCustomElement$2 } from './p-e02b091c.js';
3
+ import { d as defineCustomElement$2 } from './p-5e1a9abc.js';
4
4
 
5
5
  const popoverMenuCss = ".tds-popover-menu.sc-tds-popover-menu{box-sizing:border-box;overflow:hidden;width:160px;background-color:var(--tds-popover-menu-background);padding:16px 6px;box-shadow:0 3px 3px rgba(0, 0, 0, 0.15), 0 -1px 1px rgba(0, 0, 0, 0.1);border-radius:4px;z-index:900}.tds-popover-menu.sc-tds-popover-menu *.sc-tds-popover-menu{box-sizing:border-box}.tds-popover-menu.fluid-width.sc-tds-popover-menu{width:unset}tds-popover-core.sc-tds-popover-menu{padding:6px 0 !important}.sc-tds-popover-menu-s>tds-divider{display:block;padding:6px !important}";
6
6
  const TdsPopoverMenuStyle0 = popoverMenuCss;
@@ -25,6 +25,11 @@ const TdsSlider$1 = /*@__PURE__*/ proxyCustomElement(class TdsSlider extends H {
25
25
  this.useSnapping = false;
26
26
  this.supposedValueSlot = -1;
27
27
  this.resizeObserverAdded = false;
28
+ this.resetEventListenerAdded = false;
29
+ this.resetToInitialValue = () => {
30
+ this.forceValueUpdate(this.initialValue);
31
+ this.reset();
32
+ };
28
33
  this.label = '';
29
34
  this.value = '0';
30
35
  this.min = '0';
@@ -302,27 +307,48 @@ const TdsSlider$1 = /*@__PURE__*/ proxyCustomElement(class TdsSlider extends H {
302
307
  }
303
308
  this.calculateThumbLeftFromValue(this.value);
304
309
  this.updateTrack();
310
+ // Only set the initial value once:
311
+ if (!this.initialValue) {
312
+ this.initialValue = this.value;
313
+ }
314
+ }
315
+ componentDidRender() {
316
+ // Only add the event listener once:
317
+ if (!this.resetEventListenerAdded) {
318
+ this.formElement = this.host.closest('form');
319
+ if (this.formElement) {
320
+ this.formElement.addEventListener('reset', this.resetToInitialValue);
321
+ this.resetEventListenerAdded = true;
322
+ }
323
+ }
324
+ }
325
+ disconnectedCallback() {
326
+ if (this.resetEventListenerAdded && this.formElement) {
327
+ this.formElement.removeEventListener('reset', this.resetToInitialValue);
328
+ this.resetEventListenerAdded = false;
329
+ }
305
330
  }
306
331
  render() {
307
- return (h("div", { key: 'fd7d051192c33b19e8c68cbeaa50ea43149457bb', class: {
332
+ return (h("div", { key: 'ed4c71d1701e0711d8b01c015f137f6a3f10457e', class: {
308
333
  'tds-slider-wrapper': true,
309
334
  'read-only': this.readOnly,
310
- } }, h("input", { key: 'd2fe02893f865f5791736cb5f05b5bcd2494e471', class: "tds-slider-native-element", type: "range", name: this.name, min: this.min, max: this.max, value: this.value, disabled: this.disabled }), h("div", { key: '2d436a5654cb20923cd20ed61f9449bd0705edd2', class: {
335
+ } }, h("input", { key: '7d85ba109ec41e45a4ced646cfe092832b2013a7', class: "tds-slider-native-element", type: "range", name: this.name, min: this.min, max: this.max, value: this.value, disabled: this.disabled }), h("div", { key: '7c32efe653a6437068026e0b612bd1cdb0fd580d', class: {
311
336
  'tds-slider': true,
312
337
  'disabled': this.disabled,
313
338
  'tds-slider-small': this.useSmall,
314
339
  }, ref: (el) => {
315
340
  this.wrapperElement = el;
316
- } }, h("label", { key: 'd9d444d15acabbbc23c7b7633e5312f405ff9120', class: this.showTickNumbers && 'offset' }, this.label), this.useInput && (h("div", { key: '2f0d0419138851724891e2ab04fef2f3b3e099f1', class: "tds-slider__input-values" }, h("div", { key: '7f23007c0f4a1aa6358ffa7c5aaae027d0927b63', class: "tds-slider__input-value min-value" }, this.min))), this.useControls && (h("div", { key: 'df4a00a40c541b83aa8459dfcdaf22c348e2c80a', class: "tds-slider__controls" }, h("div", { key: '96cc419d369098137895b725f97a8fa3d7d50dfc', class: "tds-slider__control tds-slider__control-minus", onClick: (event) => this.stepLeft(event) }, h("tds-icon", { key: '09ed43c9f2fe81baeada6a07e4cba18027f04ba1', name: "minus", size: "16px" })))), h("div", { key: '402647683b57076bd4ac3ce3d754585a89a48e08', class: "tds-slider-inner" }, this.tickValues.length > 0 && (h("div", { key: 'd80c648eca47c7e52725e967a32fe4a4692a5729', class: "tds-slider__value-dividers-wrapper" }, h("div", { key: '030106df49f12a55c1b32a9c1c257f449629644a', class: "tds-slider__value-dividers" }, this.tickValues.map((value) => (h("div", { class: "tds-slider__value-divider" }, this.showTickNumbers && h("span", null, value))))))), h("div", { key: 'fef7013f82a191c32bc3a4d297f5e10a4db127a1', class: "tds-slider__track", ref: (el) => {
341
+ } }, h("label", { key: '5561410214fda42ddb4553084f312de9943f825b', class: this.showTickNumbers && 'offset' }, this.label), this.useInput && (h("div", { key: '37340de05febbca285f031bd8df7d9c2588e315d', class: "tds-slider__input-values" }, h("div", { key: 'e973831529eb93eb0b0da6c5f92bd838dfb9bcdb', class: "tds-slider__input-value min-value" }, this.min))), this.useControls && (h("div", { key: '1a710d2d1ffac7533f9bae2908d4341d3b40e2f0', class: "tds-slider__controls" }, h("div", { key: '0a741834782d8e69a7d55e6cd87a3fdf4938d744', class: "tds-slider__control tds-slider__control-minus", onClick: (event) => this.stepLeft(event) }, h("tds-icon", { key: '8c67943ac2e15d742726e76c2b4c029d15c20f32', name: "minus", size: "16px" })))), h("div", { key: '96c4229007fbe882e106bcc3deb34f504c9604e3', class: "tds-slider-inner" }, this.tickValues.length > 0 && (h("div", { key: '905fc1a02070f5419f76ec5d60d8f55d89d4650b', class: "tds-slider__value-dividers-wrapper" }, h("div", { key: 'd2ccbea1b6e26ab1855c81e71730bebea0da37d8', class: "tds-slider__value-dividers" }, this.tickValues.map((value) => (h("div", { class: "tds-slider__value-divider" }, this.showTickNumbers && h("span", null, value))))))), h("div", { key: '30c9b4bb6f59631d443345ee6d1edf1973a83d0b', class: "tds-slider__track", ref: (el) => {
317
342
  this.trackElement = el;
318
- }, tabindex: this.disabled ? '-1' : '0' }, h("div", { key: '24a583182c45114d1e011bffef0f81f1e4f93a36', class: "tds-slider__track-fill", ref: (el) => {
343
+ }, tabindex: this.disabled ? '-1' : '0' }, h("div", { key: '7acbccae98c481c4cfaeb2dc66d67a2e19575b93', class: "tds-slider__track-fill", ref: (el) => {
319
344
  this.trackFillElement = el;
320
- } }), h("div", { key: '3bea53237beb92f41264386fb5ac181d1e9966a4', class: "tds-slider__thumb", ref: (el) => {
345
+ } }), h("div", { key: '46a5c3135c5f765d5fb0845372dc3854586fa44d', class: "tds-slider__thumb", ref: (el) => {
321
346
  this.thumbElement = el;
322
- }, onMouseDown: () => this.grabThumb(), onTouchStart: () => this.grabThumb() }, this.tooltip && (h("div", { key: '3ac44629cad3b03524602f9babe7fa4582b38660', class: "tds-slider__value" }, this.value, h("svg", { key: '5adbbcc274555d14454c5329f0eea8c072a3db2c', width: "18", height: "14", viewBox: "0 0 18 14", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '248b1f8521b89be4214631e411c0ba9c7bcc07a8', d: "M8.15882 12.6915L0.990487 1.54076C0.562658 0.875246 1.0405 0 1.83167 0H16.1683C16.9595 0 17.4373 0.875246 17.0095 1.54076L9.84118 12.6915C9.44754 13.3038 8.55246 13.3038 8.15882 12.6915Z", fill: "currentColor" })))), h("div", { key: 'bc778a9ccd25a5229aa7685cc6c22ed5385b9d98', class: "tds-slider__thumb-inner", ref: (el) => {
347
+ }, onMouseDown: () => this.grabThumb(), onTouchStart: () => this.grabThumb() }, this.tooltip && (h("div", { key: 'd39cd29d1e6302f8bd4a3d827797f8822e24b84d', class: "tds-slider__value" }, this.value, h("svg", { key: '5946f90b70b2afb2efc7f3a3bc5817a82ac3ca4a', width: "18", height: "14", viewBox: "0 0 18 14", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '9456df642aca39b94b17bb529ca02e2d6a2fde6c', d: "M8.15882 12.6915L0.990487 1.54076C0.562658 0.875246 1.0405 0 1.83167 0H16.1683C16.9595 0 17.4373 0.875246 17.0095 1.54076L9.84118 12.6915C9.44754 13.3038 8.55246 13.3038 8.15882 12.6915Z", fill: "currentColor" })))), h("div", { key: 'b4ca73a085f837d7e87e3334b8e58e5638125118', class: "tds-slider__thumb-inner", ref: (el) => {
323
348
  this.thumbInnerElement = el;
324
- } })))), this.useInput && (h("div", { key: '077ffffeb0986504a2c9fc4e1b08095ec689402c', class: "tds-slider__input-values" }, h("div", { key: '74a528a286e2b49a6739c5817cca8a0436b908b9', class: "tds-slider__input-value", onClick: (event) => this.stepLeft(event) }, this.max), h("div", { key: 'af2a647636c8eecba19637aa92ddda37adc52a1b', class: "tds-slider__input-field-wrapper" }, h("input", { key: '02701d15de6119994f7be13b9c9ac69ae6f2269b', size: this.calculateInputSizeFromMax(), class: "tds-slider__input-field", value: this.value, readOnly: this.readOnly, onBlur: (event) => this.updateSliderValueOnInputChange(event), onKeyDown: (event) => this.handleInputFieldEnterPress(event), type: "number", min: this.min, max: this.max })))), this.useControls && (h("div", { key: 'ef215ef613c381601674d4bb7dbea583a3ddde2a', class: "tds-slider__controls" }, h("div", { key: '4e553194348daf32529c9c8cedc32b0686ac32ff', class: "tds-slider__control tds-slider__control-plus", onClick: (event) => this.stepRight(event) }, h("tds-icon", { key: 'd5d67ea7ff64ed19d28bd078acad56ebda742f93', name: "plus", size: "16px" })))))));
349
+ } })))), this.useInput && (h("div", { key: '6574286ac7764807fd1e18875d6fa39ab7f7b304', class: "tds-slider__input-values" }, h("div", { key: '57a92adf59551f551c4ae06355c276a69b34028a', class: "tds-slider__input-value", onClick: (event) => this.stepLeft(event) }, this.max), h("div", { key: '0e1632ca8c9510177d349147749e3162aa46f219', class: "tds-slider__input-field-wrapper" }, h("input", { key: '094d194bce54d1073a5d657f7bc3f30107f5fe41', size: this.calculateInputSizeFromMax(), class: "tds-slider__input-field", value: this.value, readOnly: this.readOnly, onBlur: (event) => this.updateSliderValueOnInputChange(event), onKeyDown: (event) => this.handleInputFieldEnterPress(event), type: "number", min: this.min, max: this.max })))), this.useControls && (h("div", { key: '207398a3fd02e11f09c70ebbb8b293d6c16afd1f', class: "tds-slider__controls" }, h("div", { key: 'ca93ce9a55d0db25a3eaefd6e4dbc53106afc895', class: "tds-slider__control tds-slider__control-plus", onClick: (event) => this.stepRight(event) }, h("tds-icon", { key: '6ab123f8701fdd93580a61c500ae6da658b547fd', name: "plus", size: "16px" })))))));
325
350
  }
351
+ get host() { return this; }
326
352
  static get watchers() { return {
327
353
  "value": ["handleValueUpdate"]
328
354
  }; }
@@ -1,5 +1,5 @@
1
1
  import { p as proxyCustomElement, H, d as createEvent, h, c as Host } from './p-28ef5186.js';
2
- import { d as defineCustomElement$2 } from './p-e4d7c655.js';
2
+ import { d as defineCustomElement$2 } from './p-d921fe75.js';
3
3
 
4
4
  const tableBodyRowCss = ":host(.tds-table__row){box-sizing:border-box;display:table-row;border-bottom:1px solid var(--tds-table-divider);background-color:var(--tds-table-body-row-background);transition:background-color 200ms ease;color:var(--tds-table-color)}:host(.tds-table__row) *{box-sizing:border-box}:host(.tds-table__row) .tds-table__body-cell--checkbox{min-width:48px;width:48px;padding:0}:host(.tds-table__row:hover){background-color:var(--tds-table-body-row-background-hover)}:host(.tds-table__row--selected){background-color:var(--tds-table-body-row-background-selected)}:host(.tds-table__row--selected:hover){background-color:var(--tds-table-body-row-background-selected-hover)}:host(.tds-table__row--hidden){display:none}:host(.tds-table__row--expended){width:100%;background-color:pink}:host .tds-form-label--table{width:100%;height:48px;display:flex;justify-content:center;align-items:center;cursor:pointer}:host(.tds-table__compact) .tds-form-label--table{height:32px}:host(.tds-table--divider) .tds-table__body-cell--checkbox{border-right:1px solid var(--tds-table-divider)}:host(.tds-table__row--clickable){cursor:pointer}:host(.tds-table__row--clickable:focus-visible){outline:var(--focus-outline, 2px solid blue)}";
5
5
  const TdsTableBodyRowStyle0 = tableBodyRowCss;
@@ -1,7 +1,7 @@
1
1
  import { p as proxyCustomElement, H, d as createEvent, h, c as Host } from './p-28ef5186.js';
2
- import { d as defineCustomElement$5 } from './p-e4d7c655.js';
3
- import { d as defineCustomElement$4 } from './p-4d8f8d5c.js';
4
- import { d as defineCustomElement$3 } from './p-462b77e8.js';
2
+ import { d as defineCustomElement$5 } from './p-d921fe75.js';
3
+ import { d as defineCustomElement$4 } from './p-d8c96665.js';
4
+ import { d as defineCustomElement$3 } from './p-e7868876.js';
5
5
  import { d as defineCustomElement$2 } from './p-18c1245b.js';
6
6
 
7
7
  const tableFooterCss = ":host{box-sizing:border-box;display:table-footer-group;height:var(--tds-spacing-element-48)}:host *{box-sizing:border-box}:host .tds-table__footer-row{background-color:var(--tds-table-footer-background);color:var(--tds-table-color)}:host .tds-table__footer-cell{padding:0 var(--tds-spacing-element-16)}:host .tds-table__footer-cell .tds-table__pagination{height:var(--tds-spacing-element-48);display:flex;align-items:center;justify-content:space-between}:host .tds-table__footer-cell .tds-table__pagination .tds-table__row-selector,:host .tds-table__footer-cell .tds-table__pagination .tds-table__page-selector{display:flex;align-items:center}:host .tds-table__footer-cell .tds-table__pagination .tds-table__row-selector .rows-per-page,:host .tds-table__footer-cell .tds-table__pagination .tds-table__page-selector .rows-per-page{display:flex;align-items:center;margin-right:var(--tds-spacing-element-16)}:host .tds-table__footer-cell .tds-table__pagination .tds-table__row-selector .rows-per-page p,:host .tds-table__footer-cell .tds-table__pagination .tds-table__page-selector .rows-per-page p{margin-right:var(--tds-spacing-element-8)}:host .tds-table__footer-cell .tds-table__pagination .tds-table__page-selector-input{font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);background-color:var(--tds-table-footer-page-selector-input-background);color:var(--tds-table-color);width:74px;height:30px;border:none;border-radius:var(--tds-spacing-element-4);transition:background-color 250ms ease;margin-right:var(--tds-spacing-element-4);padding-left:var(--tds-spacing-element-16)}:host .tds-table__footer-cell .tds-table__pagination .tds-table__page-selector-input:hover{background-color:var(--tds-table-footer-page-selector-input-background-hover)}:host .tds-table__footer-cell .tds-table__pagination .tds-table__page-selector-input:disabled{color:var(--tds-table-footer-page-selector-input-color-disabled)}:host .tds-table__footer-cell .tds-table__pagination .tds-table__page-selector-input--shake{animation:tds-shake-animation 0.5s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;transform:translate3d(0, 0, 0);backface-visibility:hidden;perspective:1000px}:host .tds-table__footer-cell .tds-table__pagination .tds-table__footer-text{font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);padding:1px 8px 0 0}:host .tds-table__footer-cell .tds-table__pagination .tds-table__footer-btn{display:flex;justify-content:center;align-items:center;border:none;background-color:transparent;cursor:pointer;height:var(--tds-spacing-element-32);width:var(--tds-spacing-element-32);border-radius:var(--tds-spacing-element-4);transition:background-color 250ms ease;color:var(--tds-table-footer-page-selector-icon)}:host .tds-table__footer-cell .tds-table__pagination .tds-table__footer-btn:hover{background-color:var(--tds-table-footer-btn-hover)}:host .tds-table__footer-cell .tds-table__pagination .tds-table__footer-btn:disabled{cursor:default;color:var(--tds-table-footer-page-selector-icon-disabled)}:host .tds-table__footer-cell .tds-table__pagination .tds-table__footer-btn:disabled:hover{background-color:transparent}:host .tds-table__footer-cell .tds-table__pagination .tds-table__footer-btn-svg{height:var(--tds-spacing-element-20);width:var(--tds-spacing-element-20);fill:var(--tds-table-color)}:host(.tds-table--compact){height:var(--tds-spacing-element-32)}:host(.tds-table--compact) .tds-table__footer-cell .tds-table__pagination{height:var(--tds-spacing-element-32)}:host(.tds-table--compact) .tds-table__footer-cell .tds-table__pagination .tds-table__page-selector-input{height:var(--tds-spacing-element-24)}:host(.tds-table--compact) .tds-table__footer-cell .tds-table__pagination .tds-table__footer-btn{height:28px;width:28px}:host(.footer__horizontal-scroll){display:inline-table;position:absolute;margin-top:10px}@keyframes tds-shake-animation{10%,90%{transform:translate3d(-1px, 0, 0)}20%,80%{transform:translate3d(2px, 0, 0)}30%,50%,70%{transform:translate3d(-4px, 0, 0)}40%,60%{transform:translate3d(4px, 0, 0)}}tds-dropdown:focus-within::after{content:\"\";position:absolute;bottom:0;left:0;height:100%;width:100%;background-color:transparent;border-radius:var(--tds-spacing-element-4);pointer-events:none;outline:2px solid var(--tds-blue-400);outline-offset:-2px}";
@@ -1,5 +1,5 @@
1
1
  import { p as proxyCustomElement, H, d as createEvent, h, c as Host } from './p-28ef5186.js';
2
- import { d as defineCustomElement$2 } from './p-e4d7c655.js';
2
+ import { d as defineCustomElement$2 } from './p-d921fe75.js';
3
3
 
4
4
  const tableHeaderCss = ":host{box-sizing:border-box;display:table-header-group}:host *{box-sizing:border-box}:host .tds-table__header-cell--checkbox{font:var(--tds-headline-07);letter-spacing:var(--tds-headline-07-ls);display:table-cell;text-align:left;color:var(--tds-table-color);background-color:var(--tds-table-header-background);border-bottom:1px solid var(--tds-table-divider);height:48px;box-sizing:border-box;overflow:hidden;transition:background-color 200ms ease;min-width:unset;width:48px;padding:0;border-top-left-radius:4px}:host .tds-form-label--table{width:100%;height:48px;display:flex;justify-content:center;align-items:center;cursor:pointer}:host .tds-table__expand-control-container{display:flex;justify-content:center;align-items:center;height:48px;cursor:pointer}:host .tds-table__expand-control-container .tds-table__expand-input{display:none}:host .tds-table__expand-control-container .tds-expandable-row-icon{height:20px;width:20px;transition:transform 200ms ease;transform:rotate(0)}:host .tds-table__expand-control-container .tds-expandable-row-icon--opened{transform:rotate(180deg)}:host ::slotted(tds-header-cell:hover){background-color:var(--tds-table-header-background-hover)}:host(.tds-table--compact) .tds-table__header-cell--checkbox{height:32px}:host(.tds-table--compact) .tds-form-label--table{height:32px}:host(.tds-table--divider) .tds-table__header-cell--checkbox{border-right:1px solid var(--tds-table-divider)}:host(.tds-table--toolbar-available) .tds-table__header-cell--checkbox{border-top-left-radius:0}";
5
5
  const TdsTableHeaderStyle0 = tableHeaderCss;
@@ -1,6 +1,6 @@
1
1
  import { p as proxyCustomElement, H, h, c as Host } from './p-28ef5186.js';
2
2
  import { i as inheritAttributes } from './p-3fe9cbbf.js';
3
- import { d as defineCustomElement$2 } from './p-e02b091c.js';
3
+ import { d as defineCustomElement$2 } from './p-5e1a9abc.js';
4
4
 
5
5
  const tooltipCss = ".sc-tds-tooltip-h{position:absolute}.tds-tooltip.sc-tds-tooltip{box-sizing:border-box;font:var(--tds-detail-05);letter-spacing:var(--tds-detail-05-ls);color:var(--tds-tooltip-color);background-color:var(--tds-tooltip-background);border-radius:4px;padding:8px;word-wrap:break-word;white-space:normal;max-width:192px;z-index:900;opacity:0;visibility:hidden;transition:opacity 200ms ease-in, visibility 200ms ease-in}.tds-tooltip.sc-tds-tooltip *.sc-tds-tooltip{box-sizing:border-box}.tds-tooltip.tds-tooltip-top-left.sc-tds-tooltip{border-radius:0 4px 4px}.tds-tooltip.tds-tooltip-top-right.sc-tds-tooltip{border-radius:4px 0 4px 4px}.tds-tooltip.tds-tooltip-bottom-right.sc-tds-tooltip{border-radius:4px 4px 0}.tds-tooltip.tds-tooltip-bottom-left.sc-tds-tooltip{border-radius:4px 4px 4px 0}.tds-tooltip-show.sc-tds-tooltip{opacity:1;visibility:visible}";
6
6
  const TdsTooltipStyle0 = tooltipCss;