@politiet/sheriff-web-components 2.7.2 → 2.8.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 (61) hide show
  1. package/custom-elements.json +79 -7
  2. package/dist/mixins/sds-dialog-target-mixin.d.ts.map +1 -1
  3. package/dist/mixins/sds-dialog-target-mixin.js +4 -2
  4. package/dist/mixins/sds-dialog-target-mixin.js.map +1 -1
  5. package/dist/mixins/sds-form-control-mixin.d.ts +1 -0
  6. package/dist/mixins/sds-form-control-mixin.d.ts.map +1 -1
  7. package/dist/mixins/sds-form-control-mixin.js +7 -0
  8. package/dist/mixins/sds-form-control-mixin.js.map +1 -1
  9. package/dist/sds-button/sds-button.component.d.ts +2 -0
  10. package/dist/sds-button/sds-button.component.d.ts.map +1 -1
  11. package/dist/sds-button/sds-button.component.js +5 -1
  12. package/dist/sds-button/sds-button.component.js.map +1 -1
  13. package/dist/sds-button/sds-button.styles.d.ts.map +1 -1
  14. package/dist/sds-button/sds-button.styles.js +87 -3
  15. package/dist/sds-button/sds-button.styles.js.map +1 -1
  16. package/dist/sds-card/sds-card.styles.d.ts.map +1 -1
  17. package/dist/sds-card/sds-card.styles.js +9 -3
  18. package/dist/sds-card/sds-card.styles.js.map +1 -1
  19. package/dist/sds-checkbox/sds-checkbox.styles.d.ts.map +1 -1
  20. package/dist/sds-checkbox/sds-checkbox.styles.js +4 -2
  21. package/dist/sds-checkbox/sds-checkbox.styles.js.map +1 -1
  22. package/dist/sds-details/sds-details.styles.js +6 -6
  23. package/dist/sds-details/sds-details.styles.js.map +1 -1
  24. package/dist/sds-dialog/sds-dialog.styles.d.ts.map +1 -1
  25. package/dist/sds-dialog/sds-dialog.styles.js +8 -2
  26. package/dist/sds-dialog/sds-dialog.styles.js.map +1 -1
  27. package/dist/sds-radio/sds-radio.styles.d.ts.map +1 -1
  28. package/dist/sds-radio/sds-radio.styles.js +10 -3
  29. package/dist/sds-radio/sds-radio.styles.js.map +1 -1
  30. package/dist/sds-select/sds-select.component.d.ts +1 -1
  31. package/dist/sds-select/sds-select.component.d.ts.map +1 -1
  32. package/dist/sds-select/sds-select.component.js +2 -1
  33. package/dist/sds-select/sds-select.component.js.map +1 -1
  34. package/dist/sds-select/sds-select.styles.d.ts.map +1 -1
  35. package/dist/sds-select/sds-select.styles.js +3 -2
  36. package/dist/sds-select/sds-select.styles.js.map +1 -1
  37. package/dist/sds-stepper-step/sds-stepper-step.styles.d.ts.map +1 -1
  38. package/dist/sds-stepper-step/sds-stepper-step.styles.js +4 -3
  39. package/dist/sds-stepper-step/sds-stepper-step.styles.js.map +1 -1
  40. package/dist/sds-switch/sds-switch.styles.js +6 -6
  41. package/dist/sds-switch/sds-switch.styles.js.map +1 -1
  42. package/dist/sds-text/sds-text.styles.d.ts.map +1 -1
  43. package/dist/sds-text/sds-text.styles.js +2 -1
  44. package/dist/sds-text/sds-text.styles.js.map +1 -1
  45. package/dist/sds-textarea/sds-textarea.d.ts +1 -1
  46. package/dist/sds-textarea/sds-textarea.d.ts.map +1 -1
  47. package/dist/sds-textarea/sds-textarea.js +6 -1
  48. package/dist/sds-textarea/sds-textarea.js.map +1 -1
  49. package/dist/sds-textarea/sds-textarea.styles.d.ts.map +1 -1
  50. package/dist/sds-textarea/sds-textarea.styles.js +11 -3
  51. package/dist/sds-textarea/sds-textarea.styles.js.map +1 -1
  52. package/dist/sds-textfield/sds-textfield.d.ts +5 -1
  53. package/dist/sds-textfield/sds-textfield.d.ts.map +1 -1
  54. package/dist/sds-textfield/sds-textfield.js +27 -10
  55. package/dist/sds-textfield/sds-textfield.js.map +1 -1
  56. package/dist/sds-textfield/sds-textfield.styles.d.ts.map +1 -1
  57. package/dist/sds-textfield/sds-textfield.styles.js +4 -3
  58. package/dist/sds-textfield/sds-textfield.styles.js.map +1 -1
  59. package/dist/sheriff-web-components.js +276 -157
  60. package/package.json +2 -2
  61. package/web-types.json +98 -2
package/dist/sheriff-web-components.js CHANGED
@@ -242,6 +242,7 @@ var t;const e=globalThis,s=e.ShadowRoot&&(void 0===e.ShadyCSS||e.ShadyCSS.native
242
242
  --_sds-button-focus-color: var(--sds-button-focus-color, var(--sds-color-states-focus-outer));
243
243
  --_sds-button-focus-inner-color: var(--sds-button-focus-inner-color, var(--sds-color-states-focus-inner));
244
244
  --_sds-button-focus-spacing: var(--sds-button-focus-spacing, var(--sds-color-states-focus-spacing));
245
+ --_sds-button-focus-outline-size: var(--sds-button-focus-outline-size, var(--sds-color-states-focus-outline-size));
245
246
  --_sds-button-font-family: var(--sds-button-font, var(--sds-typography-font-family-roboto));
246
247
  --_sds-button-font-size: var(--sds-button-font-size, var(--sds-components-font-size-content-lg));
247
248
  --_sds-button-font-weight: var(--sds-button-font-weight, var(--sds-typography-body-md-strong-desktop-font-weight));
@@ -290,9 +291,9 @@ var t;const e=globalThis,s=e.ShadowRoot&&(void 0===e.ShadyCSS||e.ShadyCSS.native
290
291
  }
291
292
 
292
293
  &:focus-visible {
293
- box-shadow: 0 0 0 var(--sds-color-states-focus-spacing) var(--_sds-button-focus-inner-color);
294
- outline: 3px solid var(--_sds-button-focus-color);
295
- outline-offset: 3px;
294
+ box-shadow: 0 0 0 var(--_sds-button-focus-spacing) var(--_sds-button-focus-inner-color);
295
+ outline: var(--_sds-button-focus-outline-size) solid var(--_sds-button-focus-color);
296
+ outline-offset: var(--_sds-button-focus-spacing);
296
297
  }
297
298
 
298
299
  &:active {
@@ -405,132 +406,90 @@ var t;const e=globalThis,s=e.ShadowRoot&&(void 0===e.ShadyCSS||e.ShadyCSS.native
405
406
  --_sds-button-padding-inline: var(--sds-button-padding-inline, 0);
406
407
  min-width: var(--_sds-button-min-height);
407
408
  }
408
- `;function Jt(t){return class extends t{focus(){this.disabled||this.control?.focus()}blur(){this.disabled||this.control?.blur()}click(){this.disabled||this.readOnly||this.control?.click()}}}var te=Object.defineProperty,ee=(t,e,s,o)=>{for(var r,a=void 0,i=t.length-1;i>=0;i--)(r=t[i])&&(a=r(e,s,a)||a);return a&&te(e,s,a),a};function se(t){const e=class extends t{constructor(...t){super(...t),this.disabled=!1,this.readOnly=!1,this.internals=this.attachInternals()}get form(){return this.internals.form}formDisabledCallback(t){this.disabled=t}};e.formAssociated=!0,e.shadowRootOptions={...ft.shadowRootOptions,delegatesFocus:!0};let s=e;return ee([S({type:String,reflect:!0})],s.prototype,"name"),ee([S({type:Boolean,reflect:!0})],s.prototype,"disabled"),ee([S({type:Boolean,attribute:"readonly",reflect:!0})],s.prototype,"readOnly"),s}const oe=d`
409
- :host {
410
- --_sds-dialog-background-color: var(--sds-dialog-background-color, var(--sds-color-surface-default, var(--sds-color-main-surface-default)));
411
- --_sds-dialog-backdrop-color: var(--sds-dialog-backdrop-color, rgba(0, 0, 0, 0.5));
412
-
413
- --_sds-dialog-border-color: var(--sds-dialog-border-color, var(--sds-color-border-subtle, var(--sds-color-main-border-subtle)));
414
- --_sds-dialog-border-radius: var(--sds-dialog-border-radius, var(--sds-radius-md));
415
- --_sds-dialog-border-width: var(--sds-dialog-border-width, var(--sds-border-sm));
416
-
417
- --_sds-dialog-max-width: var(--sds-dialog-max-width, min(60ch, 100vw));
418
- --_sds-dialog-max-height: var(--sds-dialog-max-height, calc(100dvh - var(--sds-spacing-lg)));
419
-
420
- --_sds-dialog-margin: var(--sds-dialog-margin, auto);
421
- --_sds-dialog-padding-block: var(--sds-dialog-padding-block, var(--sds-spacing-sm));
422
- --_sds-dialog-padding-inline: var(--sds-dialog-padding-inline, var(--sds-spacing-sm));
423
- --_sds-dialog-gap: var(--sds-dialog-gap, var(--sds-spacing-xs));
424
-
425
- --_sds-dialog-font-family: var(--sds-dialog-font-family, var(--sds-typography-font-family-roboto));
426
- --_sds-dialog-text-color: var(--sds-dialog-text-color, var(--sds-color-text-default, var(--sds-color-main-text-default)));
427
-
428
- --_sds-dialog-box-shadow: var(--sds-dialog-box-shadow, 0 4px 6px -1px rgba(0, 0, 0, 0.1));
429
-
430
- --_sds-dialog-animation-duration: var(--sds-dialog-animation-duration, 200ms);
431
- --_sds-dialog-close-button-offset: var(--sds-dialog-close-button-offset, var(--sds-spacing-3xs));
432
-
433
- display: contents;
434
- }
435
409
 
436
- dialog {
437
- color: var(--_sds-dialog-text-color);
438
- background-color: var(--_sds-dialog-background-color);
439
- box-shadow: var(--_sds-dialog-box-shadow);
410
+ :host([inverted]) {
411
+ --_sds-button-background-color: var(--sds-button-background-color, var(--sds-color-action-contrast-default, var(--sds-color-accent-action-contrast-default)));
412
+ --_sds-button-border-color: var(--sds-button-border-color, var(--sds-color-action-contrast-default, var(--sds-color-accent-action-contrast-default)));
413
+ --_sds-button-text-color: var(--sds-button-text-color, var(--sds-color-action-default, var(--sds-color-accent-action-default)));
440
414
 
441
- border: var(--_sds-dialog-border-width) solid var(--_sds-dialog-border-color);
442
- border-radius: var(--_sds-dialog-border-radius);
415
+ --sds-loader-main-color: var(--sds-color-action-default, var(--sds-color-accent-action-default));
416
+ --sds-loader-secondary-color: var(--sds-color-border-subtle, var(--sds-color-accent-border-subtle));
417
+ --sds-icon-color: var(--sds-color-action-default, var(--sds-color-accent-action-default));
443
418
 
444
- font-family: var(--_sds-dialog-font-family);
445
-
446
- max-width: var(--_sds-dialog-max-width);
447
- max-height: var(--_sds-dialog-max-height);
448
-
449
- overflow: auto;
450
- padding: 0;
451
-
452
- opacity: 0;
453
- transform: translateY(-1rem);
454
- animation: sds-dialog-fade-in var(--_sds-dialog-animation-duration) ease-out forwards;
455
-
456
- &:focus-visible {
457
- outline: 3px solid var(--sds-color-states-focus-outer);
458
- outline-offset: 3px;
419
+ .sds-button:hover {
420
+ --_sds-button-background-color: var(--sds-button-background-color, var(--sds-color-surface-hover, var(--sds-color-accent-surface-hover)));
421
+ --_sds-button-border-color: var(--sds-button-border-color, var(--sds-color-surface-hover, var(--sds-color-accent-surface-hover)));
459
422
  }
460
423
 
461
- &[open] {
462
- display: flex;
463
- flex-direction: column;
464
- margin: var(--_sds-dialog-margin);
465
- padding-block: var(--_sds-dialog-padding-block);
466
- padding-inline: var(--_sds-dialog-padding-inline);
467
- gap: var(--_sds-dialog-gap);
424
+ .sds-button:active {
425
+ --_sds-button-background-color: var(--sds-button-background-color, var(--sds-color-surface-active, var(--sds-color-accent-surface-active)));
426
+ --_sds-button-border-color: var(--sds-button-border-color, var(--sds-color-surface-active, var(--sds-color-accent-surface-active)));
468
427
  }
428
+ }
469
429
 
470
- &.sds-dialog__empty-header:has(.sds-dialog__close-button) {
471
- /* Set padding right to avoid overflowing the close button */
472
- padding-right: var(--sds-dialog-padding-right, var(--sds-spacing-lg));
430
+ :host([inverted][variant='primary']) {
431
+ .sds-button:disabled {
432
+ --_sds-button-background-color: var(--sds-button-background-color, var(--sds-color-action-contrast-default, var(--sds-color-neutral-action-contrast-default)));
433
+ --_sds-button-border-color: var(--sds-button-border-color, var(--sds-color-action-contrast-default, var(--sds-color-neutral-action-contrast-default)));
434
+ --_sds-button-text-color: var(--sds-button-text-color, var(--sds-color-action-default, var(--sds-color-neutral-action-default)));
473
435
  }
436
+ }
474
437
 
475
- &::backdrop {
476
- background-color: var(--_sds-dialog-backdrop-color);
477
- /* @keyframes does not work for ::backdrop in Firefox, so use transition instead */
478
- transition: opacity var(--_sds-dialog-animation-duration) ease-out;
479
- opacity: 0;
438
+ :host([inverted][variant='secondary']) {
439
+ --_sds-button-background-color: var(--sds-button-background-color, transparent);
440
+ --_sds-button-border-color: var(--sds-button-border-color, var(--sds-color-action-contrast-default, var(--sds-color-accent-action-contrast-default)));
441
+ --_sds-button-text-color: var(--sds-button-text-color, var(--sds-color-action-contrast-default, var(--sds-color-accent-action-contrast-default)));
442
+ --sds-loader-main-color: var(--sds-color-accent-action-contrast-default);
443
+
444
+ .sds-button:hover {
445
+ --_sds-button-background-color: var(--sds-button-background-color, var(--sds-color-action-contrast-default, var(--sds-color-accent-action-contrast-default)));
446
+ --_sds-button-border-color: var(--sds-button-border-color, var(--sds-color-action-contrast-default, var(--sds-color-accent-action-contrast-default)));
447
+ --_sds-button-text-color: var(--sds-button-text-color, var(--sds-color-action-default, var(--sds-color-accent-action-default)));
448
+ --sds-loader-main-color: var(--sds-color-accent-action-default);
480
449
  }
481
450
 
482
- &[open]::backdrop {
483
- opacity: 1;
451
+ .sds-button:active {
452
+ --_sds-button-background-color: var(--sds-button-background-color, var(--sds-color-surface-active, var(--sds-color-accent-surface-active)));
453
+ --_sds-button-border-color: var(--sds-button-border-color, var(--sds-color-surface-active, var(--sds-color-accent-surface-active)));
454
+ --_sds-button-text-color: var(--sds-button-text-color, var(--sds-color-action-default, var(--sds-color-accent-action-default)));
455
+ --sds-loader-main-color: var(--sds-color-accent-action-default);
484
456
  }
485
- }
486
457
 
487
- @keyframes sds-dialog-fade-in {
488
- to {
489
- opacity: 1;
490
- transform: translateY(0);
458
+ .sds-button:disabled {
459
+ --_sds-button-background-color: var(--sds-button-background-color, transparent);
460
+ --_sds-button-border-color: var(--sds-button-border-color, var(--sds-color-action-contrast-default, var(--sds-color-neutral-action-contrast-default)));
461
+ --_sds-button-text-color: var(--sds-button-text-color, var(--sds-color-action-contrast-default, var(--sds-color-neutral-action-contrast-default)));
491
462
  }
492
463
  }
493
464
 
494
- .sds-dialog__close-button {
495
- --sds-button-text-color: var(--sds-dialog-close-button-color, var(--sds-color-text-subtle, var(--sds-color-main-text-subtle)));
496
- --sds-button-padding-inline: 0;
497
-
498
- position: absolute;
499
- top: var(--_sds-dialog-close-button-offset);
500
- right: var(--_sds-dialog-close-button-offset);
501
- z-index: 1;
502
- }
465
+ :host([inverted][variant='tertiary']) {
466
+ --_sds-button-background-color: var(--sds-button-background-color, transparent);
467
+ --_sds-button-border-color: var(--sds-button-border-color, transparent);
468
+ --_sds-button-text-color: var(--sds-button-text-color, var(--sds-color-action-contrast-default, var(--sds-color-accent-action-contrast-default)));
469
+ --sds-typography-link-text-decoration: none;
470
+ --sds-loader-main-color: var(--sds-color-accent-action-contrast-default);
503
471
 
504
- .sds-dialog__header {
505
- margin-right: var(--sds-spacing-lg);
506
- }
472
+ .sds-button:hover {
473
+ --_sds-button-background-color: var(--sds-button-background-color, var(--sds-color-action-contrast-default, var(--sds-color-accent-action-contrast-default)));
474
+ --_sds-button-border-color: var(--sds-button-border-color, var(--sds-color-action-contrast-default, var(--sds-color-accent-action-contrast-default)));
475
+ --_sds-button-text-color: var(--sds-button-text-color, var(--sds-color-action-default, var(--sds-color-accent-action-default)));
476
+ --sds-loader-main-color: var(--sds-color-accent-action-default);
477
+ }
507
478
 
508
- @media (max-width: 640px) {
509
- :host {
510
- --_sds-dialog-max-width: var(--sds-dialog-max-width, 100%);
511
- --_sds-dialog-margin: var(--sds-dialog-margin, var(--sds-spacing-xs));
479
+ .sds-button:active {
480
+ --_sds-button-background-color: var(--sds-button-background-color, var(--sds-color-surface-active, var(--sds-color-accent-surface-active)));
481
+ --_sds-button-border-color: var(--sds-button-border-color, var(--sds-color-surface-active, var(--sds-color-accent-surface-active)));
482
+ --_sds-button-text-color: var(--sds-button-text-color, var(--sds-color-action-default, var(--sds-color-accent-action-default)));
483
+ --sds-loader-main-color: var(--sds-color-accent-action-default);
512
484
  }
513
- }
514
485
 
515
- @media (prefers-reduced-motion: reduce) {
516
- :host {
517
- --_sds-dialog-animation-duration: 0ms;
486
+ .sds-button:disabled {
487
+ --_sds-button-background-color: var(--sds-button-background-color, transparent);
488
+ --_sds-button-border-color: var(--sds-button-border-color, transparent);
489
+ --_sds-button-text-color: var(--sds-button-text-color, var(--sds-color-action-contrast-default, var(--sds-color-neutral-action-contrast-default)));
518
490
  }
519
491
  }
520
- `;var re=Object.defineProperty,ae=(t,e,s,o)=>{for(var r,a=void 0,i=t.length-1;i>=0;i--)(r=t[i])&&(a=r(e,s,a)||a);return a&&re(e,s,a),a};const ie=class extends(St(ft)){constructor(){super(...arguments),this.open=!1,this.modal=!1,this.closedby="closerequest",this.closeButtonLabel="Lukk dialogvindu",this._isHeaderSlotEmpty=!0,this._pointerDownInside=!1,this._handleClose=()=>{this.open=!1,this.dispatchSheriffEvent("sds-close")},this._handleClick=t=>{const e=t.target;e?.closest('[data-command="close"],[command="close"]')&&this._closeDialog()},this._handlePointerDown=t=>{const e=this._dialog.getBoundingClientRect(),{clientX:s,clientY:o}=t;this._pointerDownInside=e.top<=o&&o<=e.bottom&&e.left<=s&&s<=e.right},this._handlePointerUp=t=>{const e=this._pointerDownInside;this._pointerDownInside=!1,"any"!==this.closedby||e||t.target===this._dialog&&requestAnimationFrame(()=>{this._dialog&&this._dialog.open&&this._closeDialog()})},this._handleCancel=t=>{"none"===this.closedby&&t.preventDefault()},this._handleHeaderSlotChange=t=>{const e=t.target;this._isHeaderSlotEmpty=0===e.assignedElements().length},this._handleAutoFocus=()=>{const t=this.shadowRoot?.querySelector("slot:not([name])")?.assignedElements({flatten:!0});if(!t||0===t.length)return;const e=t.find(t=>null!=t.getAttribute("autofocus"));e instanceof HTMLElement&&document.activeElement!==e&&e.focus()}}firstUpdated(){this._setupEventListeners(),this.open&&this._openDialog()}updated(t){t.has("open")&&(this.open?this._openDialog():this._closeDialog())}_setupEventListeners(){this._dialog.addEventListener("close",this._handleClose),this._dialog.addEventListener("cancel",this._handleCancel),this._dialog.addEventListener("click",this._handleClick),this._dialog.addEventListener("pointerdown",this._handlePointerDown),this._dialog.addEventListener("pointerup",this._handlePointerUp),this._dialog.addEventListener("animationend",this._handleAutoFocus)}_openDialog(){this._dialog&&(this.modal?this._dialog.showModal():this._dialog.show())}_closeDialog(){this._dialog&&this._dialog.close()}show(){this.open=!0}showModal(){this.modal=!0,this.open=!0}close(){this.open=!1}requestClose(){this._dialog&&this._dialog.requestClose()}render(){return Q`
521
- <dialog .closedBy="${this.closedby}" class=${this._isHeaderSlotEmpty?"sds-dialog__empty-header":""}>
522
- <div class="sds-dialog__header">
523
- <slot name="header" @slotchange=${this._handleHeaderSlotChange}></slot>
524
- ${this.closeButtonLabel?Q`
525
- <sds-button class="sds-dialog__close-button" icon variant="tertiary" size="md" command="close" label="${this.closeButtonLabel}">
526
- <sds-icon name="close-material-outlined" size="md"></sds-icon>
527
- </sds-button>
528
- `:tt}
529
- </div>
530
- <slot></slot>
531
- <slot name="footer"></slot>
532
- </dialog>
533
- `}};ie.styles=[oe];let de=ie;ae([S({type:Boolean,reflect:!0})],de.prototype,"open"),ae([S({type:Boolean,reflect:!0})],de.prototype,"modal"),ae([S({type:String,reflect:!0})],de.prototype,"closedby"),ae([S({type:String,attribute:"close-button-label"})],de.prototype,"closeButtonLabel"),ae([A("dialog")],de.prototype,"_dialog"),ae([C()],de.prototype,"_isHeaderSlotEmpty");var ne=Object.getOwnPropertyDescriptor;let le=class extends de{};le=((t,e,s,o)=>{for(var r,a=o>1?void 0:o?ne(e,s):e,i=t.length-1;i>=0;i--)(r=t[i])&&(a=r(a)||a);return a})([L("sds-dialog")],le);var ce=Object.defineProperty,he=(t,e,s,o)=>{for(var r,a=void 0,i=t.length-1;i>=0;i--)(r=t[i])&&(a=r(e,s,a)||a);return a&&ce(e,s,a),a};var pe=Object.defineProperty,ge=(t,e,s,o)=>{for(var r,a=void 0,i=t.length-1;i>=0;i--)(r=t[i])&&(a=r(e,s,a)||a);return a&&pe(e,s,a),a};var ve=Object.defineProperty,ue=(t,e,s,o)=>{for(var r,a=void 0,i=t.length-1;i>=0;i--)(r=t[i])&&(a=r(e,s,a)||a);return a&&ve(e,s,a),a};const fe=class extends(function(t){class e extends t{get effectiveCommand(){return this.command??this.dataCommand}get effectiveCommandFor(){return this.commandFor??this.dataCommandFor}updated(t){super.updated(t),(t.has("command")||t.has("commandFor")||t.has("dataCommand")||t.has("dataCommandFor"))&&this._updateCommandTarget()}disconnectedCallback(){super.disconnectedCallback(),this._cleanupDialogObserver()}_cleanupDialogObserver(){this._dialogOpenObserver&&(this._dialogOpenObserver.disconnect(),this._dialogOpenObserver=void 0),this._dialogElement=void 0}_observeDialog(t,e){this._dialogOpenObserver=new MutationObserver(s=>{for(const o of s)if("open"===o.attributeName){const s=e.hasAttribute("open");t.setAttribute("aria-expanded",String(s))}}),this._dialogOpenObserver.observe(e,{attributes:!0,attributeFilter:["open"]})}_clearAriaFields(t){t.removeAttribute("aria-haspopup"),t.removeAttribute("aria-expanded"),t.removeAttribute("aria-controls")}_updateCommandTarget(){this._cleanupDialogObserver();const t=this.shadowRoot?.querySelector("#control");if(!t)return;const e=this.effectiveCommand,s=this.effectiveCommandFor;if(!s||!e)return void this._clearAriaFields(t);const o=this.getRootNode(),r=o.getElementById?.(s)??document.getElementById(s);r&&r instanceof le?(this._dialogElement=r,"show-modal"===e?(t.setAttribute("aria-haspopup","dialog"),t.setAttribute("aria-expanded",String(r.open)),t.setAttribute("aria-controls",s),this._observeDialog(t,r)):this._clearAriaFields(t)):this._clearAriaFields(t)}runDialogCommand(){if(this._dialogElement)switch(this.effectiveCommand){case"show-modal":this._dialogElement.showModal();break;case"close":this._dialogElement.close();break;case"request-close":this._dialogElement.requestClose()}}}return he([S({type:String,attribute:"command",reflect:!0})],e.prototype,"command"),he([S({type:String,attribute:"commandfor",reflect:!0})],e.prototype,"commandFor"),he([S({type:String,attribute:"data-command"})],e.prototype,"dataCommand"),he([S({type:String,attribute:"data-commandfor"})],e.prototype,"dataCommandFor"),e}(function(t){class e extends t{updated(t){super.updated(t),(t.has("popoverTarget")||t.has("popoverTargetAction"))&&this._updatePopoverTarget()}disconnectedCallback(){super.disconnectedCallback(),this._cleanupPopoverListener()}_cleanupPopoverListener(){this._popoverToggleHandler&&this._popoverElement&&(this._popoverElement.removeEventListener("toggle",this._popoverToggleHandler),this._popoverToggleHandler=void 0,this._popoverElement=void 0)}_updatePopoverTarget(){const t=this.shadowRoot?.querySelector("#control");if(t)if(this._cleanupPopoverListener(),this.popoverTarget){const e=this.getRootNode(),s=e.getElementById?.(this.popoverTarget)??document.getElementById(this.popoverTarget);if(s){t.popoverTargetElement=s,this._popoverElement=s;const e=s.getAttribute("role");"tooltip"===e?t.setAttribute("aria-describedby",this.popoverTarget):(this._popoverToggleHandler=e=>{const s="open"===e.newState;t.setAttribute("aria-expanded",String(s))},s.addEventListener("toggle",this._popoverToggleHandler),t.setAttribute("aria-haspopup",e||"dialog"),t.setAttribute("aria-expanded","false"),t.setAttribute("aria-controls",this.popoverTarget))}this.popoverTargetAction&&(t.popoverTargetAction=this.popoverTargetAction)}else t.popoverTargetElement=null,t.popoverTargetAction="",t.removeAttribute("aria-haspopup"),t.removeAttribute("aria-expanded"),t.removeAttribute("aria-controls"),t.removeAttribute("aria-describedby")}}return ge([S({type:String,attribute:"popovertarget"})],e.prototype,"popoverTarget"),ge([S({type:String,attribute:"popovertargetaction"})],e.prototype,"popoverTargetAction"),e}(Jt(St(ft))))){constructor(){super(),this.disabled=!1,this.icon=!1,this.loading=!1,this.size="lg",this.type="button",this.value="",this.variant="primary",this.label=void 0,this._handleClick=t=>{if(this.popoverTarget)return t.stopImmediatePropagation(),void(this.disabled||this.dispatchSheriffEvent("click"));if(this.effectiveCommandFor&&this.effectiveCommand)return t.preventDefault(),t.stopImmediatePropagation(),void(this.disabled||(this.runDialogCommand(),this.dispatchSheriffEvent("click")));if(t.preventDefault(),t.stopImmediatePropagation(),!this.disabled)switch(this.type){case"submit":if(this.dispatchSheriffEvent("submit"))if(this.form){const t=this.getRootNode().querySelector(`form#${this.form}`);t?.requestSubmit()}else this.internals.form&&this.internals.form.requestSubmit();break;case"reset":if(this.dispatchSheriffEvent("reset"))if(this.form){const t=this.getRootNode().querySelector(`form#${this.form}`);t?.reset()}else this.internals.form&&this.internals.form.reset();break;default:this.dispatchSheriffEvent("click")}},this.internals=this.attachInternals()}updated(t){super.updated(t),t.has("variant")&&"critical"===this.variant&&this.setAttribute("data-palette","danger")}render(){const t={"sds-button":!0,"sds-button--as-link":!!this.href};return this.href?Q` <a id="link" class="${Zt(t)}" href="${this.href}" target="${Pt(this.target)}">
492
+ `;function Jt(t){return class extends t{focus(){this.disabled||this.control?.focus()}blur(){this.disabled||this.control?.blur()}click(){this.disabled||this.readOnly||this.control?.click()}}}var te=Object.defineProperty,ee=(t,e,s,o)=>{for(var r,a=void 0,i=t.length-1;i>=0;i--)(r=t[i])&&(a=r(e,s,a)||a);return a&&te(e,s,a),a};function se(t){const e=class extends t{constructor(...t){super(...t),this.disabled=!1,this.readOnly=!1,this.internals=this.attachInternals()}get form(){return this.internals.form}formDisabledCallback(t){this.disabled=t}firstUpdated(t){super.firstUpdated(t),this.updateValidity()}updateValidity(){}};e.formAssociated=!0,e.shadowRootOptions={...ft.shadowRootOptions,delegatesFocus:!0};let s=e;return ee([S({type:String,reflect:!0})],s.prototype,"name"),ee([S({type:Boolean,reflect:!0})],s.prototype,"disabled"),ee([S({type:Boolean,attribute:"readonly",reflect:!0})],s.prototype,"readOnly"),s}var oe=Object.defineProperty,re=(t,e,s,o)=>{for(var r,a=void 0,i=t.length-1;i>=0;i--)(r=t[i])&&(a=r(e,s,a)||a);return a&&oe(e,s,a),a};var ae=Object.defineProperty,ie=(t,e,s,o)=>{for(var r,a=void 0,i=t.length-1;i>=0;i--)(r=t[i])&&(a=r(e,s,a)||a);return a&&ae(e,s,a),a};var de=Object.defineProperty,ne=(t,e,s,o)=>{for(var r,a=void 0,i=t.length-1;i>=0;i--)(r=t[i])&&(a=r(e,s,a)||a);return a&&de(e,s,a),a};const le=class extends(function(t){class e extends t{get effectiveCommand(){return this.command??this.dataCommand}get effectiveCommandFor(){return this.commandFor??this.dataCommandFor}updated(t){super.updated(t),(t.has("command")||t.has("commandFor")||t.has("dataCommand")||t.has("dataCommandFor"))&&this._updateCommandTarget()}disconnectedCallback(){super.disconnectedCallback(),this._cleanupDialogObserver()}_cleanupDialogObserver(){this._dialogOpenObserver&&(this._dialogOpenObserver.disconnect(),this._dialogOpenObserver=void 0),this._dialogElement=void 0}_observeDialog(t,e){this._dialogOpenObserver=new MutationObserver(s=>{for(const o of s)if("open"===o.attributeName){const s=e.hasAttribute("open");t.setAttribute("aria-expanded",String(s))}}),this._dialogOpenObserver.observe(e,{attributes:!0,attributeFilter:["open"]})}_clearAriaFields(t){t.removeAttribute("aria-haspopup"),t.removeAttribute("aria-expanded"),t.removeAttribute("aria-controls")}_updateCommandTarget(){this._cleanupDialogObserver();const t=this.shadowRoot?.querySelector("#control");if(!t)return;const e=this.effectiveCommand,s=this.effectiveCommandFor;if(!s||!e)return void this._clearAriaFields(t);const o=this.getRootNode(),r=o.getElementById?.(s)??document.getElementById(s);var a;null!=(a=r)&&"showModal"in a&&"requestClose"in a&&"close"in a&&"open"in a?(this._dialogElement=r,"show-modal"===e?(t.setAttribute("aria-haspopup","dialog"),t.setAttribute("aria-expanded",String(r.open)),t.setAttribute("aria-controls",s),this._observeDialog(t,r)):this._clearAriaFields(t)):this._clearAriaFields(t)}runDialogCommand(){if(this._dialogElement)switch(this.effectiveCommand){case"show-modal":this._dialogElement.showModal();break;case"close":this._dialogElement.close();break;case"request-close":this._dialogElement.requestClose()}}}return re([S({type:String,attribute:"command",reflect:!0})],e.prototype,"command"),re([S({type:String,attribute:"commandfor",reflect:!0})],e.prototype,"commandFor"),re([S({type:String,attribute:"data-command"})],e.prototype,"dataCommand"),re([S({type:String,attribute:"data-commandfor"})],e.prototype,"dataCommandFor"),e}(function(t){class e extends t{updated(t){super.updated(t),(t.has("popoverTarget")||t.has("popoverTargetAction"))&&this._updatePopoverTarget()}disconnectedCallback(){super.disconnectedCallback(),this._cleanupPopoverListener()}_cleanupPopoverListener(){this._popoverToggleHandler&&this._popoverElement&&(this._popoverElement.removeEventListener("toggle",this._popoverToggleHandler),this._popoverToggleHandler=void 0,this._popoverElement=void 0)}_updatePopoverTarget(){const t=this.shadowRoot?.querySelector("#control");if(t)if(this._cleanupPopoverListener(),this.popoverTarget){const e=this.getRootNode(),s=e.getElementById?.(this.popoverTarget)??document.getElementById(this.popoverTarget);if(s){t.popoverTargetElement=s,this._popoverElement=s;const e=s.getAttribute("role");"tooltip"===e?t.setAttribute("aria-describedby",this.popoverTarget):(this._popoverToggleHandler=e=>{const s="open"===e.newState;t.setAttribute("aria-expanded",String(s))},s.addEventListener("toggle",this._popoverToggleHandler),t.setAttribute("aria-haspopup",e||"dialog"),t.setAttribute("aria-expanded","false"),t.setAttribute("aria-controls",this.popoverTarget))}this.popoverTargetAction&&(t.popoverTargetAction=this.popoverTargetAction)}else t.popoverTargetElement=null,t.popoverTargetAction="",t.removeAttribute("aria-haspopup"),t.removeAttribute("aria-expanded"),t.removeAttribute("aria-controls"),t.removeAttribute("aria-describedby")}}return ie([S({type:String,attribute:"popovertarget"})],e.prototype,"popoverTarget"),ie([S({type:String,attribute:"popovertargetaction"})],e.prototype,"popoverTargetAction"),e}(Jt(St(ft))))){constructor(){super(),this.disabled=!1,this.icon=!1,this.inverted=!1,this.loading=!1,this.size="lg",this.type="button",this.value="",this.variant="primary",this.label=void 0,this._handleClick=t=>{if(this.popoverTarget)return t.stopImmediatePropagation(),void(this.disabled||this.dispatchSheriffEvent("click"));if(this.effectiveCommandFor&&this.effectiveCommand)return t.preventDefault(),t.stopImmediatePropagation(),void(this.disabled||(this.runDialogCommand(),this.dispatchSheriffEvent("click")));if(t.preventDefault(),t.stopImmediatePropagation(),!this.disabled)switch(this.type){case"submit":if(this.dispatchSheriffEvent("submit"))if(this.form){const t=this.getRootNode().querySelector(`form#${this.form}`);t?.requestSubmit()}else this.internals.form&&this.internals.form.requestSubmit();break;case"reset":if(this.dispatchSheriffEvent("reset"))if(this.form){const t=this.getRootNode().querySelector(`form#${this.form}`);t?.reset()}else this.internals.form&&this.internals.form.reset();break;default:this.dispatchSheriffEvent("click")}},this.internals=this.attachInternals()}updated(t){super.updated(t),t.has("variant")&&"critical"===this.variant&&this.setAttribute("data-palette","danger")}render(){const t={"sds-button":!0,"sds-button--as-link":!!this.href};return this.href?Q` <a id="link" class="${Zt(t)}" href="${this.href}" target="${Pt(this.target)}">
534
493
  <slot name="before"></slot>
535
494
  <slot></slot>
536
495
  <slot name="after"></slot>
@@ -546,11 +505,11 @@ var t;const e=globalThis,s=e.ShadowRoot&&(void 0===e.ShadyCSS||e.ShadyCSS.native
546
505
  @click="${this._handleClick}"
547
506
  aria-label="${Pt(this.label)}"
548
507
  >
549
- ${this.loading?Q`<sds-loader slot="before" ?contrast="${"primary"!==this.variant}"></sds-loader>`:tt} ${this.loading?tt:Q`<slot name="before"></slot>`}
508
+ ${this.loading?Q`<sds-loader slot="before" ?contrast="${this.inverted||"primary"!==this.variant}"></sds-loader>`:tt} ${this.loading?tt:Q`<slot name="before"></slot>`}
550
509
  <slot></slot>
551
510
  ${this.loading?tt:Q`<slot name="after"></slot>`}
552
511
  </button>
553
- `}};fe.styles=[Qt],fe.formAssociated=!0,fe.shadowRootOptions={...ft.shadowRootOptions,delegatesFocus:!0};let be=fe;ue([S({type:Boolean,reflect:!0})],be.prototype,"disabled"),ue([S({type:Boolean,reflect:!0})],be.prototype,"icon"),ue([S({type:Boolean,reflect:!0})],be.prototype,"loading"),ue([S({type:String,reflect:!0})],be.prototype,"form"),ue([S({type:String,reflect:!0})],be.prototype,"href"),ue([S({type:String,reflect:!0})],be.prototype,"name"),ue([S({type:String,reflect:!0})],be.prototype,"size"),ue([S({type:String,reflect:!0})],be.prototype,"target"),ue([S({type:String,reflect:!0})],be.prototype,"type"),ue([S({type:String,reflect:!0})],be.prototype,"value"),ue([S({type:String,reflect:!0})],be.prototype,"variant"),ue([S({type:String,reflect:!0})],be.prototype,"label"),ue([A("#control")],be.prototype,"control");var me=Object.getOwnPropertyDescriptor;let _e=class extends be{};_e=((t,e,s,o)=>{for(var r,a=o>1?void 0:o?me(e,s):e,i=t.length-1;i>=0;i--)(r=t[i])&&(a=r(a)||a);return a})([L("sds-button")],_e);var xe=Object.getOwnPropertyDescriptor;let ye=class extends Lt{};function we(t,e,s,o){const r=t?.assignedNodes({flatten:!0}).filter(t=>{if(t.nodeType===Node.TEXT_NODE){return(t.textContent?.trim()??"").length>0}if(t.nodeType===Node.ELEMENT_NODE){const s=t,o=s.tagName.toUpperCase();if(!e.includes(o))return!0;return Array.from(s.childNodes).some(t=>t.nodeType===Node.ELEMENT_NODE)}return!1});r?.length>0&&console.warn(o,...r)}ye=((t,e,s,o)=>{for(var r,a=o>1?void 0:o?xe(e,s):e,i=t.length-1;i>=0;i--)(r=t[i])&&(a=r(a)||a);return a})([L("sds-alert")],ye);const ke=d`
512
+ `}};le.styles=[Qt],le.formAssociated=!0,le.shadowRootOptions={...ft.shadowRootOptions,delegatesFocus:!0};let ce=le;ne([S({type:Boolean,reflect:!0})],ce.prototype,"disabled"),ne([S({type:Boolean,reflect:!0})],ce.prototype,"icon"),ne([S({type:Boolean,reflect:!0})],ce.prototype,"inverted"),ne([S({type:Boolean,reflect:!0})],ce.prototype,"loading"),ne([S({type:String,reflect:!0})],ce.prototype,"form"),ne([S({type:String,reflect:!0})],ce.prototype,"href"),ne([S({type:String,reflect:!0})],ce.prototype,"name"),ne([S({type:String,reflect:!0})],ce.prototype,"size"),ne([S({type:String,reflect:!0})],ce.prototype,"target"),ne([S({type:String,reflect:!0})],ce.prototype,"type"),ne([S({type:String,reflect:!0})],ce.prototype,"value"),ne([S({type:String,reflect:!0})],ce.prototype,"variant"),ne([S({type:String,reflect:!0})],ce.prototype,"label"),ne([A("#control")],ce.prototype,"control");var he=Object.getOwnPropertyDescriptor;let pe=class extends ce{};pe=((t,e,s,o)=>{for(var r,a=o>1?void 0:o?he(e,s):e,i=t.length-1;i>=0;i--)(r=t[i])&&(a=r(a)||a);return a})([L("sds-button")],pe);var ge=Object.getOwnPropertyDescriptor;let ve=class extends Lt{};function ue(t,e,s,o){const r=t?.assignedNodes({flatten:!0}).filter(t=>{if(t.nodeType===Node.TEXT_NODE){return(t.textContent?.trim()??"").length>0}if(t.nodeType===Node.ELEMENT_NODE){const s=t,o=s.tagName.toUpperCase();if(!e.includes(o))return!0;return Array.from(s.childNodes).some(t=>t.nodeType===Node.ELEMENT_NODE)}return!1});r?.length>0&&console.warn(o,...r)}ve=((t,e,s,o)=>{for(var r,a=o>1?void 0:o?ge(e,s):e,i=t.length-1;i>=0;i--)(r=t[i])&&(a=r(a)||a);return a})([L("sds-alert")],ve);const fe=d`
554
513
  :host {
555
514
  --_sds-card-background-color: var(--sds-card-background-color, var(--sds-color-surface-tinted, var(--sds-color-main-surface-tinted)));
556
515
  --_sds-card-border-radius: var(--sds-card-border-radius, var(--sds-radius-md));
@@ -560,6 +519,7 @@ var t;const e=globalThis,s=e.ShadowRoot&&(void 0===e.ShadyCSS||e.ShadyCSS.native
560
519
  --_sds-card-focus-color: var(--sds-card-focus-color, var(--sds-color-states-focus-outer));
561
520
  --_sds-card-focus-inner-color: var(--sds-card-focus-inner-color, var(--sds-color-states-focus-inner));
562
521
  --_sds-card-focus-spacing: var(--sds-card-focus-spacing, var(--sds-color-states-focus-spacing));
522
+ --_sds-card-focus-outline-size: var(--sds-card-focus-outline-size, var(--sds-color-states-focus-outline-size));
563
523
  --_sds-card-icon-color: var(--sds-card-icon-color, var(--sds-color-neutral-text-default));
564
524
  --_sds-card-icon-display: var(--sds-card-icon-display, block);
565
525
 
@@ -576,6 +536,11 @@ var t;const e=globalThis,s=e.ShadowRoot&&(void 0===e.ShadyCSS||e.ShadyCSS.native
576
536
  display: block;
577
537
  }
578
538
 
539
+ .sds-card {
540
+ height: 100%;
541
+ display: grid;
542
+ }
543
+
579
544
  .sds-card__content {
580
545
  background-color: var(--_sds-card-background-color);
581
546
  border-radius: var(--_sds-card-border-radius);
@@ -586,7 +551,7 @@ var t;const e=globalThis,s=e.ShadowRoot&&(void 0===e.ShadyCSS||e.ShadyCSS.native
586
551
 
587
552
  display: grid;
588
553
  grid-template-columns: 1fr auto;
589
- grid-template-rows: auto auto;
554
+ grid-template-rows: auto 1fr;
590
555
  grid-template-areas:
591
556
  "heading icon"
592
557
  "text text";
@@ -600,8 +565,8 @@ var t;const e=globalThis,s=e.ShadowRoot&&(void 0===e.ShadyCSS||e.ShadyCSS.native
600
565
  }
601
566
 
602
567
  &:focus-visible {
603
- box-shadow: 0 0 0 var(--sds-color-states-focus-spacing) var(--_sds-card-focus-inner-color);
604
- outline: var(--_sds-card-focus-spacing) solid var(--_sds-card-focus-color);
568
+ box-shadow: 0 0 0 var(--_sds-card-focus-spacing) var(--_sds-card-focus-inner-color);
569
+ outline: var(--_sds-card-focus-outline-size) solid var(--_sds-card-focus-color);
605
570
  outline-offset: var(--_sds-card-focus-spacing);
606
571
  }
607
572
  }
@@ -674,11 +639,11 @@ var t;const e=globalThis,s=e.ShadowRoot&&(void 0===e.ShadyCSS||e.ShadyCSS.native
674
639
  --_sds-card-text-line-height: var(--sds-card-text-line-height, var(--sds-typography-body-md-desktop-line-height));
675
640
  }
676
641
  }
677
- `;var ze=Object.defineProperty,$e=Object.getOwnPropertyDescriptor,Se=(t,e,s,o)=>{for(var r,a=o>1?void 0:o?$e(e,s):e,i=t.length-1;i>=0;i--)(r=t[i])&&(a=(o?r(e,s,a):r(a))||a);return o&&a&&ze(e,s,a),a};let Ce=class extends ft{constructor(){super(...arguments),this._contentWarning="[sds-card] text slot should only contain top-level <p> elements with no nested elements:",this._headerWarning="[sds-card] header slot should only contain one of <h2>–<h6> elements:",this._handleHeadingSlotChange=()=>{this.headingSlot.assignedNodes({flatten:!0}).length>0&&we(this.headingSlot,["H2","H3","H4","H5","H6"],0,this._headerWarning)},this._handleTextSlotChange=()=>{we(this.textSlot,["P"],0,this._contentWarning)}}firstUpdated(){we(this.textSlot,["P"],0,this._contentWarning);this.headingSlot.assignedNodes({flatten:!0}).length>0&&we(this.headingSlot,["H2","H3","H4","H5","H6"],0,this._headerWarning)}render(){const t=Q`
642
+ `;var be=Object.defineProperty,me=Object.getOwnPropertyDescriptor,_e=(t,e,s,o)=>{for(var r,a=o>1?void 0:o?me(e,s):e,i=t.length-1;i>=0;i--)(r=t[i])&&(a=(o?r(e,s,a):r(a))||a);return o&&a&&be(e,s,a),a};let xe=class extends ft{constructor(){super(...arguments),this._contentWarning="[sds-card] text slot should only contain top-level <p> elements with no nested elements:",this._headerWarning="[sds-card] header slot should only contain one of <h2>–<h6> elements:",this._handleHeadingSlotChange=()=>{this.headingSlot.assignedNodes({flatten:!0}).length>0&&ue(this.headingSlot,["H2","H3","H4","H5","H6"],0,this._headerWarning)},this._handleTextSlotChange=()=>{ue(this.textSlot,["P"],0,this._contentWarning)}}firstUpdated(){ue(this.textSlot,["P"],0,this._contentWarning);this.headingSlot.assignedNodes({flatten:!0}).length>0&&ue(this.headingSlot,["H2","H3","H4","H5","H6"],0,this._headerWarning)}render(){const t=Q`
678
643
  <slot name="heading" id="heading" @slotchange=${this._handleHeadingSlotChange}></slot>
679
644
  <slot name="text" id="content" @slotchange=${this._handleTextSlotChange}></slot>
680
645
  <sds-icon name="arrow_forward-material-outlined" size="md" class="sds-card__icon" role="presentation"></sds-icon>
681
- `;return Q`<article class="sds-card">${this.link?Q`<a href="${this.link}" class="sds-card__content">${t}</a>`:Q`<div class="sds-card__content">${t}</div>`}</article>`}};Ce.styles=[ke],Se([S({type:String,reflect:!0})],Ce.prototype,"link",2),Se([A("slot#heading")],Ce.prototype,"headingSlot",2),Se([A("slot#text")],Ce.prototype,"textSlot",2),Ce=Se([L("sds-card")],Ce);const Ee=d`
646
+ `;return Q`<article class="sds-card">${this.link?Q`<a href="${this.link}" class="sds-card__content">${t}</a>`:Q`<div class="sds-card__content">${t}</div>`}</article>`}};xe.styles=[fe],_e([S({type:String,reflect:!0})],xe.prototype,"link",2),_e([A("slot#heading")],xe.prototype,"headingSlot",2),_e([A("slot#text")],xe.prototype,"textSlot",2),xe=_e([L("sds-card")],xe);const ye=d`
682
647
  :host {
683
648
  --_sds-checkbox-block-gap: var(--sds-checkbox-block-gap, var(--sds-spacing-4xs));
684
649
  --_sds-checkbox-inline-gap: var(--sds-checkbox-inline-gap, var(--sds-spacing-3xs));
@@ -706,6 +671,7 @@ var t;const e=globalThis,s=e.ShadowRoot&&(void 0===e.ShadyCSS||e.ShadyCSS.native
706
671
  --_sds-checkbox-focus-color-outer: var(--sds-checkbox-focus-color-outer, var(--sds-color-states-focus-outer));
707
672
  --_sds-checkbox-focus-color-inner: var(--sds-checkbox-focus-color-inner, var(--sds-color-states-focus-inner));
708
673
  --_sds-checkbox-focus-spacing: var(--sds-checkbox-focus-spacing, var(--sds-color-states-focus-spacing));
674
+ --_sds-checkbox-focus-outline-size: var(--sds-checkbox-focus-outline-size, var(--sds-color-states-focus-outline-size));
709
675
  --_sds-checkbox-focus-radius: var(--sds-checkbox-focus-radius, var(--sds-radius-xs));
710
676
 
711
677
  --_sds-checkbox-disabled-opacity: var(--sds-checkbox-disabled-opacity, var(--sds-color-states-disabled-opacity));
@@ -734,8 +700,9 @@ var t;const e=globalThis,s=e.ShadowRoot&&(void 0===e.ShadyCSS||e.ShadyCSS.native
734
700
  }
735
701
 
736
702
  &:has(:focus-visible) {
737
- outline: var(--_sds-checkbox-focus-spacing) solid var(--_sds-checkbox-focus-color-outer);
738
- outline-offset: calc(var(--_sds-checkbox-focus-spacing) * 2);
703
+ box-shadow: 0 0 0 var(--_sds-checkbox-focus-spacing) var(--_sds-checkbox-focus-color-inner);
704
+ outline: var(--_sds-checkbox-focus-outline-size) solid var(--_sds-checkbox-focus-color-outer);
705
+ outline-offset: var(--_sds-checkbox-focus-spacing);
739
706
  border-radius: var(--_sds-checkbox-focus-radius);
740
707
  }
741
708
  }
@@ -901,7 +868,7 @@ var t;const e=globalThis,s=e.ShadowRoot&&(void 0===e.ShadyCSS||e.ShadyCSS.native
901
868
  margin-block-start: -1px;
902
869
  }
903
870
  }
904
- `;var Ae=Object.defineProperty,Oe=Object.getOwnPropertyDescriptor,Le=(t,e,s,o)=>{for(var r,a=o>1?void 0:o?Oe(e,s):e,i=t.length-1;i>=0;i--)(r=t[i])&&(a=(o?r(e,s,a):r(a))||a);return o&&a&&Ae(e,s,a),a};let Pe=class extends(Jt(St(se(ft)))){constructor(){super(...arguments),this.checked=!1,this.error=!1,this.required=!1,this.size="md",this._disabled=!1,this._disabledIsAuthorControlled=!1,this._settingDisabledFromParent=!1,this._parentRequestDisabled=!1,this._initialChecked=!1,this._handleChange=t=>{if(t.stopImmediatePropagation(),this.disabled||this.readOnly)return t.target.checked=this.checked,void t.preventDefault();const e=t.target;this.checked=e.checked,this.internals.setFormValue(e.checked?e.value:null),this._validate(),this.dispatchSheriffEvent("change")},this._handleFocus=t=>{t.stopImmediatePropagation(),this.dispatchSheriffEvent("focus")},this._handleBlur=t=>{t.stopImmediatePropagation(),this.dispatchSheriffEvent("blur")}}get disabled(){return this._disabled}set disabled(t){const e=t??!1,s=this._disabled;s!==e&&(this._disabled=e,this.requestUpdate("disabled",s),this._settingDisabledFromParent||(this._disabledIsAuthorControlled=e))}get parentRequestDisabled(){return this._parentRequestDisabled}set parentRequestDisabled(t){const e=t??!1,s=this._parentRequestDisabled;s!==e&&(this._parentRequestDisabled=e,this.requestUpdate("parentRequestDisabled",s),this._disabledIsAuthorControlled||(this._settingDisabledFromParent=!0,this.disabled=e,this._settingDisabledFromParent=!1))}connectedCallback(){super.connectedCallback(),this._initialChecked=this.checked,this.internals.role="none",this.checked&&this.internals.setFormValue(this.value??"on")}firstUpdated(t){super.firstUpdated(t),this.control&&(this.control.required=this.required),this._validate()}formResetCallback(){this.checked=this._initialChecked,this.control&&(this.control.checked=this._initialChecked);const t=this.checked?this.value??"on":null;this.internals.setFormValue(t),this._validate()}_validate(){this.required&&!this.checked?this.internals.setValidity({valueMissing:!0},this.control.validationMessage,this.control):this.internals.setValidity({})}updated(t){super.updated(t),t.has("required")&&this.control&&(this.control.required=this.required),t.has("checked")&&this._validate(),this._disabledIsAuthorControlled||this.disabled===this._parentRequestDisabled||(this._settingDisabledFromParent=!0,this.disabled=this._parentRequestDisabled??!1,this._settingDisabledFromParent=!1)}get type(){return"checkbox"}render(){const t={"sds-checkbox":!0,"sds-checkbox--error":Boolean(this.error)},e={"sds-checkbox__input":!0,"sds-checkbox__input--error":Boolean(this.error)},s=this.helpText?"help-text":void 0;return Q`
871
+ `;var we=Object.defineProperty,ke=Object.getOwnPropertyDescriptor,ze=(t,e,s,o)=>{for(var r,a=o>1?void 0:o?ke(e,s):e,i=t.length-1;i>=0;i--)(r=t[i])&&(a=(o?r(e,s,a):r(a))||a);return o&&a&&we(e,s,a),a};let $e=class extends(Jt(St(se(ft)))){constructor(){super(...arguments),this.checked=!1,this.error=!1,this.required=!1,this.size="md",this._disabled=!1,this._disabledIsAuthorControlled=!1,this._settingDisabledFromParent=!1,this._parentRequestDisabled=!1,this._initialChecked=!1,this._handleChange=t=>{if(t.stopImmediatePropagation(),this.disabled||this.readOnly)return t.target.checked=this.checked,void t.preventDefault();const e=t.target;this.checked=e.checked,this.internals.setFormValue(e.checked?e.value:null),this._validate(),this.dispatchSheriffEvent("change")},this._handleFocus=t=>{t.stopImmediatePropagation(),this.dispatchSheriffEvent("focus")},this._handleBlur=t=>{t.stopImmediatePropagation(),this.dispatchSheriffEvent("blur")}}get disabled(){return this._disabled}set disabled(t){const e=t??!1,s=this._disabled;s!==e&&(this._disabled=e,this.requestUpdate("disabled",s),this._settingDisabledFromParent||(this._disabledIsAuthorControlled=e))}get parentRequestDisabled(){return this._parentRequestDisabled}set parentRequestDisabled(t){const e=t??!1,s=this._parentRequestDisabled;s!==e&&(this._parentRequestDisabled=e,this.requestUpdate("parentRequestDisabled",s),this._disabledIsAuthorControlled||(this._settingDisabledFromParent=!0,this.disabled=e,this._settingDisabledFromParent=!1))}connectedCallback(){super.connectedCallback(),this._initialChecked=this.checked,this.internals.role="none",this.checked&&this.internals.setFormValue(this.value??"on")}firstUpdated(t){super.firstUpdated(t),this.control&&(this.control.required=this.required),this._validate()}formResetCallback(){this.checked=this._initialChecked,this.control&&(this.control.checked=this._initialChecked);const t=this.checked?this.value??"on":null;this.internals.setFormValue(t),this._validate()}_validate(){this.required&&!this.checked?this.internals.setValidity({valueMissing:!0},this.control.validationMessage,this.control):this.internals.setValidity({})}updated(t){super.updated(t),t.has("required")&&this.control&&(this.control.required=this.required),t.has("checked")&&this._validate(),this._disabledIsAuthorControlled||this.disabled===this._parentRequestDisabled||(this._settingDisabledFromParent=!0,this.disabled=this._parentRequestDisabled??!1,this._settingDisabledFromParent=!1)}get type(){return"checkbox"}render(){const t={"sds-checkbox":!0,"sds-checkbox--error":Boolean(this.error)},e={"sds-checkbox__input":!0,"sds-checkbox__input--error":Boolean(this.error)},s=this.helpText?"help-text":void 0;return Q`
905
872
  <div class="${Zt(t)}">
906
873
  <input
907
874
  id="control"
@@ -923,7 +890,7 @@ var t;const e=globalThis,s=e.ShadowRoot&&(void 0===e.ShadyCSS||e.ShadyCSS.native
923
890
  ${this.label?Q`<label for="control" class="sds-checkbox__label">${this.label}</label>`:tt}
924
891
  ${this.helpText?Q`<span id="help-text" class="sds-checkbox__help-text">${this.helpText}</span>`:tt}
925
892
  </div>
926
- `}};Pe.styles=[Ee],Le([S({type:String,reflect:!0})],Pe.prototype,"label",2),Le([S({type:String})],Pe.prototype,"value",2),Le([S({type:Boolean,reflect:!0})],Pe.prototype,"checked",2),Le([S({type:Boolean,reflect:!0})],Pe.prototype,"error",2),Le([S({type:Boolean,reflect:!0})],Pe.prototype,"required",2),Le([S({type:String,reflect:!0})],Pe.prototype,"size",2),Le([S({type:String,attribute:"help-text"})],Pe.prototype,"helpText",2),Le([S({type:Boolean,reflect:!0})],Pe.prototype,"disabled",1),Le([S({type:Boolean,attribute:!1})],Pe.prototype,"parentRequestDisabled",1),Le([A("#control")],Pe.prototype,"control",2),Pe=Le([L("sds-checkbox")],Pe);const De=d`
893
+ `}};$e.styles=[ye],ze([S({type:String,reflect:!0})],$e.prototype,"label",2),ze([S({type:String})],$e.prototype,"value",2),ze([S({type:Boolean,reflect:!0})],$e.prototype,"checked",2),ze([S({type:Boolean,reflect:!0})],$e.prototype,"error",2),ze([S({type:Boolean,reflect:!0})],$e.prototype,"required",2),ze([S({type:String,reflect:!0})],$e.prototype,"size",2),ze([S({type:String,attribute:"help-text"})],$e.prototype,"helpText",2),ze([S({type:Boolean,reflect:!0})],$e.prototype,"disabled",1),ze([S({type:Boolean,attribute:!1})],$e.prototype,"parentRequestDisabled",1),ze([A("#control")],$e.prototype,"control",2),$e=ze([L("sds-checkbox")],$e);const Se=d`
927
894
  :host {
928
895
  --_sds-checkbox-group-gap: var(--sds-checkbox-group-gap, var(--sds-spacing-xs));
929
896
  --_sds-checkbox-group-font-family: var(--sds-checkbox-group-font-family, var(--sds-typography-font-family-roboto));
@@ -1015,7 +982,7 @@ var t;const e=globalThis,s=e.ShadowRoot&&(void 0===e.ShadyCSS||e.ShadyCSS.native
1015
982
  --_sds-checkbox-group-help-text-font-size: var(--sds-checkbox-group-help-text-font-size, var(--sds-components-font-size-content-lg));
1016
983
  --_sds-checkbox-group-help-text-line-height: var(--sds-checkbox-group-help-text-line-height, var(--sds-components-line-height-squeezed-lg));
1017
984
  }
1018
- `;var Te=Object.defineProperty,qe=Object.getOwnPropertyDescriptor,Me=(t,e,s,o)=>{for(var r,a=o>1?void 0:o?qe(e,s):e,i=t.length-1;i>=0;i--)(r=t[i])&&(a=(o?r(e,s,a):r(a))||a);return o&&a&&Te(e,s,a),a};const Re=["disabled","errorMessage","readOnly","size"];let Ve=class extends(St(ft)){constructor(){super(...arguments),this.readOnly=!1,this.disabled=!1,this.size="md",this._selectedValues=[],this._handleCheckboxChange=t=>{const e=t.target,s=e.value,o=e.checked;this._selectedValues=o?[...this._selectedValues,s]:this._selectedValues.filter(t=>t!==s),this.dispatchSheriffEvent("sds-update")},this._handleSlotChange=()=>{this._updateChildProps([...Re])}}_getChildCheckboxes(){return this._slotElement?.assignedElements({flatten:!0}).filter(t=>"SDS-CHECKBOX"===t.tagName)??[]}_updateChildProps(t){const e=this._getChildCheckboxes();for(const s of e)for(const e of t)switch(e){case"readOnly":s.readOnly=this.readOnly;break;case"disabled":s.parentRequestDisabled=this.disabled;break;case"errorMessage":s.error=Boolean(this.errorMessage);break;case"size":s.size=this.size}}updated(t){super.updated(t);const e=Array.from(t.keys());(e.includes("errorMessage")||e.includes("error-message"))&&this._updateChildProps(["errorMessage"])}attributeChangedCallback(t,e,s){if(super.attributeChangedCallback(t,e,s),"readonly"===t)return void this._updateChildProps(["readOnly"]);const o=t;Re.includes(o)&&this._updateChildProps([o])}get value(){return{selectedValues:this._selectedValues}}render(){const t={"sds-checkbox-group":!0,"sds-checkbox-group--disabled":this.disabled,"sds-checkbox-group--error":Boolean(this.errorMessage)},e=[this.errorMessage?"error-message":null,this.helpText?"help-text":null].filter(Boolean).join(" ")||void 0;return Q`
985
+ `;var Ce=Object.defineProperty,Ee=Object.getOwnPropertyDescriptor,Ae=(t,e,s,o)=>{for(var r,a=o>1?void 0:o?Ee(e,s):e,i=t.length-1;i>=0;i--)(r=t[i])&&(a=(o?r(e,s,a):r(a))||a);return o&&a&&Ce(e,s,a),a};const Oe=["disabled","errorMessage","readOnly","size"];let Le=class extends(St(ft)){constructor(){super(...arguments),this.readOnly=!1,this.disabled=!1,this.size="md",this._selectedValues=[],this._handleCheckboxChange=t=>{const e=t.target,s=e.value,o=e.checked;this._selectedValues=o?[...this._selectedValues,s]:this._selectedValues.filter(t=>t!==s),this.dispatchSheriffEvent("sds-update")},this._handleSlotChange=()=>{this._updateChildProps([...Oe])}}_getChildCheckboxes(){return this._slotElement?.assignedElements({flatten:!0}).filter(t=>"SDS-CHECKBOX"===t.tagName)??[]}_updateChildProps(t){const e=this._getChildCheckboxes();for(const s of e)for(const e of t)switch(e){case"readOnly":s.readOnly=this.readOnly;break;case"disabled":s.parentRequestDisabled=this.disabled;break;case"errorMessage":s.error=Boolean(this.errorMessage);break;case"size":s.size=this.size}}updated(t){super.updated(t);const e=Array.from(t.keys());(e.includes("errorMessage")||e.includes("error-message"))&&this._updateChildProps(["errorMessage"])}attributeChangedCallback(t,e,s){if(super.attributeChangedCallback(t,e,s),"readonly"===t)return void this._updateChildProps(["readOnly"]);const o=t;Oe.includes(o)&&this._updateChildProps([o])}get value(){return{selectedValues:this._selectedValues}}render(){const t={"sds-checkbox-group":!0,"sds-checkbox-group--disabled":this.disabled,"sds-checkbox-group--error":Boolean(this.errorMessage)},e=[this.errorMessage?"error-message":null,this.helpText?"help-text":null].filter(Boolean).join(" ")||void 0;return Q`
1019
986
  <fieldset class="${Zt(t)}" aria-describedby="${Pt(e)}" aria-invalid="${this.errorMessage?"true":"false"}">
1020
987
  ${this.legend?Q`<legend class="sds-checkbox-group__legend">${this.readOnly?Q`<sds-icon name="lock-material-filled" size="md"></sds-icon>`:tt}</sds-icon>${this.legend}</legend>`:tt}
1021
988
  ${this.helpText?Q`<p id="help-text" class="sds-checkbox-group__help-text">${this.helpText}</p>`:tt}
@@ -1024,7 +991,7 @@ var t;const e=globalThis,s=e.ShadowRoot&&(void 0===e.ShadyCSS||e.ShadyCSS.native
1024
991
  </div>
1025
992
  ${this.errorMessage?Q`<sds-alert id="error-message" variant="secondary" data-palette="danger"><p slot="message">${this.errorMessage}</p></sds-alert>`:tt}
1026
993
  </fieldset>
1027
- `}};Ve.styles=[De],Me([S({type:String,reflect:!0})],Ve.prototype,"legend",2),Me([S({type:String,attribute:"help-text",reflect:!0})],Ve.prototype,"helpText",2),Me([S({type:String,attribute:"error-message",reflect:!0})],Ve.prototype,"errorMessage",2),Me([S({type:Boolean,attribute:"readonly",reflect:!0})],Ve.prototype,"readOnly",2),Me([S({type:Boolean,reflect:!0})],Ve.prototype,"disabled",2),Me([S({type:String,reflect:!0})],Ve.prototype,"size",2),Me([C()],Ve.prototype,"_selectedValues",2),Me([A("slot")],Ve.prototype,"_slotElement",2),Ve=Me([L("sds-checkbox-group")],Ve);const Be=d`
994
+ `}};Le.styles=[Se],Ae([S({type:String,reflect:!0})],Le.prototype,"legend",2),Ae([S({type:String,attribute:"help-text",reflect:!0})],Le.prototype,"helpText",2),Ae([S({type:String,attribute:"error-message",reflect:!0})],Le.prototype,"errorMessage",2),Ae([S({type:Boolean,attribute:"readonly",reflect:!0})],Le.prototype,"readOnly",2),Ae([S({type:Boolean,reflect:!0})],Le.prototype,"disabled",2),Ae([S({type:String,reflect:!0})],Le.prototype,"size",2),Ae([C()],Le.prototype,"_selectedValues",2),Ae([A("slot")],Le.prototype,"_slotElement",2),Le=Ae([L("sds-checkbox-group")],Le);const Pe=d`
1028
995
  :host {
1029
996
  --_sds-chip-font-family: var(--sds-chip-font-family, var(--sds-typography-font-family-roboto));
1030
997
  --_sds-chip-font-weight: var(--sds-chip-font-weight, var(--sds-typography-font-weight-regular));
@@ -1169,7 +1136,7 @@ var t;const e=globalThis,s=e.ShadowRoot&&(void 0===e.ShadyCSS||e.ShadyCSS.native
1169
1136
  white-space: nowrap;
1170
1137
  }
1171
1138
  }
1172
- `;var je=Object.defineProperty,Fe=Object.getOwnPropertyDescriptor,Ie=(t,e,s,o)=>{for(var r,a=o>1?void 0:o?Fe(e,s):e,i=t.length-1;i>=0;i--)(r=t[i])&&(a=(o?r(e,s,a):r(a))||a);return o&&a&&je(e,s,a),a};let He=class extends(Jt(St(se(ft)))){constructor(){super(...arguments),this._initialChecked=!1,this._readOnly=!1,this._slotLabel="",this.variant="selectable",this.size="md",this.checked=!1,this._handleSlotChange=t=>{const e=t.target;this._slotLabel=e.assignedNodes().map(t=>t.textContent).join("").trim()},this._handleChange=t=>{if(t.stopImmediatePropagation(),!(t.target instanceof HTMLInputElement))return;if(this.disabled||this.readOnly)return void(t.target.checked=this.checked??!1);const e=t.target;this.checked=e.checked,this.internals.setFormValue(this.checked?this.value??"on":null),this.dispatchSheriffEvent("change")},this._remove=()=>{this.disabled||this.readOnly||this.dispatchSheriffEvent("sds-remove")},this._keypress=t=>{" "!==t.key&&"Enter"!==t.key||this._remove()}}get readOnly(){return this._readOnly}set readOnly(t){const e=this._readOnly;this._readOnly=t??!1,this.requestUpdate("readOnly",e)}set readonly(t){this.readOnly=t}connectedCallback(){super.connectedCallback(),this._initialChecked=this.checked??!1,this.internals.role="none",this.checked&&this.internals.setFormValue(this.value??null)}formResetCallback(){this.checked=this._initialChecked,this.internals.setFormValue(this.value??null)}render(){const t="removable"===this.variant&&!this.readOnly&&!this.disabled,e={"sds-chip":!0,"sds-chip--small":"small"===this.size||"sm"===this.size,"sds-chip--large":"large"===this.size||"lg"===this.size,"sds-chip--removable":t};return t?Q`<button class="${Zt(e)}" @click=${this._remove} @keyup="${this._keypress}">
1139
+ `;var De=Object.defineProperty,Te=Object.getOwnPropertyDescriptor,qe=(t,e,s,o)=>{for(var r,a=o>1?void 0:o?Te(e,s):e,i=t.length-1;i>=0;i--)(r=t[i])&&(a=(o?r(e,s,a):r(a))||a);return o&&a&&De(e,s,a),a};let Me=class extends(Jt(St(se(ft)))){constructor(){super(...arguments),this._initialChecked=!1,this._readOnly=!1,this._slotLabel="",this.variant="selectable",this.size="md",this.checked=!1,this._handleSlotChange=t=>{const e=t.target;this._slotLabel=e.assignedNodes().map(t=>t.textContent).join("").trim()},this._handleChange=t=>{if(t.stopImmediatePropagation(),!(t.target instanceof HTMLInputElement))return;if(this.disabled||this.readOnly)return void(t.target.checked=this.checked??!1);const e=t.target;this.checked=e.checked,this.internals.setFormValue(this.checked?this.value??"on":null),this.dispatchSheriffEvent("change")},this._remove=()=>{this.disabled||this.readOnly||this.dispatchSheriffEvent("sds-remove")},this._keypress=t=>{" "!==t.key&&"Enter"!==t.key||this._remove()}}get readOnly(){return this._readOnly}set readOnly(t){const e=this._readOnly;this._readOnly=t??!1,this.requestUpdate("readOnly",e)}set readonly(t){this.readOnly=t}connectedCallback(){super.connectedCallback(),this._initialChecked=this.checked??!1,this.internals.role="none",this.checked&&this.internals.setFormValue(this.value??null)}formResetCallback(){this.checked=this._initialChecked,this.internals.setFormValue(this.value??null)}render(){const t="removable"===this.variant&&!this.readOnly&&!this.disabled,e={"sds-chip":!0,"sds-chip--small":"small"===this.size||"sm"===this.size,"sds-chip--large":"large"===this.size||"lg"===this.size,"sds-chip--removable":t};return t?Q`<button class="${Zt(e)}" @click=${this._remove} @keyup="${this._keypress}">
1173
1140
  <slot></slot>
1174
1141
  <sds-icon name="close-material-outlined" size="s"></sds-icon>
1175
1142
  </button>`:Q`<label class="${Zt(e)}">
@@ -1186,7 +1153,7 @@ var t;const e=globalThis,s=e.ShadowRoot&&(void 0===e.ShadyCSS||e.ShadyCSS.native
1186
1153
  @change="${this._handleChange}"
1187
1154
  />
1188
1155
  <span aria-hidden="true"><slot @slotchange="${this._handleSlotChange}"></slot></span>
1189
- </label>`}};He.styles=[Be],Ie([A("#control")],He.prototype,"control",2),Ie([C()],He.prototype,"_slotLabel",2),Ie([S({type:String,reflect:!0})],He.prototype,"variant",2),Ie([S({type:String,reflect:!0})],He.prototype,"size",2),Ie([S({type:Boolean,reflect:!0})],He.prototype,"checked",2),Ie([S({type:String})],He.prototype,"value",2),Ie([S({type:Boolean,attribute:"readonly",reflect:!0})],He.prototype,"readOnly",1),He=Ie([L("sds-chip")],He);const Ne=d`
1156
+ </label>`}};Me.styles=[Pe],qe([A("#control")],Me.prototype,"control",2),qe([C()],Me.prototype,"_slotLabel",2),qe([S({type:String,reflect:!0})],Me.prototype,"variant",2),qe([S({type:String,reflect:!0})],Me.prototype,"size",2),qe([S({type:Boolean,reflect:!0})],Me.prototype,"checked",2),qe([S({type:String})],Me.prototype,"value",2),qe([S({type:Boolean,attribute:"readonly",reflect:!0})],Me.prototype,"readOnly",1),Me=qe([L("sds-chip")],Me);const Re=d`
1190
1157
  :host {
1191
1158
  --_sds-details-text-color: var(--sds-details-text-color, var(--sds-color-text-default, var(--sds-color-main-text-default)));
1192
1159
 
@@ -1199,9 +1166,9 @@ var t;const e=globalThis,s=e.ShadowRoot&&(void 0===e.ShadyCSS||e.ShadyCSS.native
1199
1166
  --_sds-details-content-padding: var(--sds-details-content-padding, var(--sds-spacing-xs));
1200
1167
  --_sds-details-content-background-color: var(--sds-details-background-color, var(--sds-color-surface-default, var(--sds-color-main-surface-default)));
1201
1168
 
1202
- --_sds-details-focus-outline-width: var(--sds-details-focus-outline-width, var(--sds-border-md));
1203
- --_sds-details-focus-outline-color: var(--sds-details-focus-outline-color, var(--sds-color-states-focus-outer));
1204
- --_sds-details-focus-outline-offset: var(--sds-details-focus-outline-offset, var(--sds-color-states-focus-spacing));
1169
+ --_sds-details-focus-outline-size: var(--sds-details-focus-outline-size, var(--sds-details-focus-outline-width, var(--sds-color-states-focus-outline-size)));
1170
+ --_sds-details-focus-color: var(--sds-details-focus-color, var(--sds-details-focus-outline-color, var(--sds-color-states-focus-outer)));
1171
+ --_sds-details-focus-spacing: var(--sds-details-focus-spacing, var(--sds-details-focus-outline-offset, var(--sds-color-states-focus-spacing)));
1205
1172
  --_sds-details-focus-inner-color: var(--sds-details-focus-inner-color, var(--sds-color-states-focus-inner));
1206
1173
 
1207
1174
  --_sds-details-icon-transition: var(--sds-details-icon-transition, transform 0.2s ease);
@@ -1277,9 +1244,9 @@ var t;const e=globalThis,s=e.ShadowRoot&&(void 0===e.ShadyCSS||e.ShadyCSS.native
1277
1244
  }
1278
1245
 
1279
1246
  &:focus-visible {
1280
- box-shadow: 0 0 0 var(--sds-color-states-focus-spacing) var(--_sds-details-focus-inner-color);
1281
- outline: var(--_sds-details-focus-outline-width) solid var(--_sds-details-focus-outline-color);
1282
- outline-offset: var(--_sds-details-focus-outline-offset);
1247
+ box-shadow: 0 0 0 var(--_sds-details-focus-spacing) var(--_sds-details-focus-inner-color);
1248
+ outline: var(--_sds-details-focus-outline-size) solid var(--_sds-details-focus-color);
1249
+ outline-offset: var(--_sds-details-focus-spacing);
1283
1250
  }
1284
1251
  }
1285
1252
 
@@ -1322,7 +1289,7 @@ var t;const e=globalThis,s=e.ShadowRoot&&(void 0===e.ShadyCSS||e.ShadyCSS.native
1322
1289
  display: inline;
1323
1290
  margin: 0;
1324
1291
  }
1325
- `;var Ue=Object.defineProperty,We=Object.getOwnPropertyDescriptor,Ke=(t,e,s,o)=>{for(var r,a=o>1?void 0:o?We(e,s):e,i=t.length-1;i>=0;i--)(r=t[i])&&(a=(o?r(e,s,a):r(a))||a);return o&&a&&Ue(e,s,a),a};let Ge=class extends(St(ft)){constructor(){super(...arguments),this.open=!1,this.standalone=!1,this.name=void 0,this._initialized=!1,this._handleToggle=t=>{const e=t.currentTarget;this.open!==e.open&&(this.open=e.open)}}updated(t){this._initialized?t.has("open")&&this.dispatchSheriffEvent("toggle",{open:!!this.open}):this._initialized=!0}render(){return Q`
1292
+ `;var Ve=Object.defineProperty,Be=Object.getOwnPropertyDescriptor,je=(t,e,s,o)=>{for(var r,a=o>1?void 0:o?Be(e,s):e,i=t.length-1;i>=0;i--)(r=t[i])&&(a=(o?r(e,s,a):r(a))||a);return o&&a&&Ve(e,s,a),a};let Fe=class extends(St(ft)){constructor(){super(...arguments),this.open=!1,this.standalone=!1,this.name=void 0,this._initialized=!1,this._handleToggle=t=>{const e=t.currentTarget;this.open!==e.open&&(this.open=e.open)}}updated(t){this._initialized?t.has("open")&&this.dispatchSheriffEvent("toggle",{open:!!this.open}):this._initialized=!0}render(){return Q`
1326
1293
  <details class="sds-details" .name="${this.name??""}" ?data-standalone="${this.standalone}" ?open="${this.open}" @toggle="${this._handleToggle}">
1327
1294
  <summary class="sds-details__summary">
1328
1295
  <sds-icon name="chevron_up-material-filled" role="presentation"></sds-icon>
@@ -1334,7 +1301,7 @@ var t;const e=globalThis,s=e.ShadowRoot&&(void 0===e.ShadyCSS||e.ShadyCSS.native
1334
1301
  <slot></slot>
1335
1302
  </div>
1336
1303
  </details>
1337
- `}};Ge.styles=[Ne],Ke([S({type:Boolean,reflect:!0})],Ge.prototype,"open",2),Ke([S({type:Boolean,reflect:!0})],Ge.prototype,"standalone",2),Ke([S({type:String,reflect:!0})],Ge.prototype,"name",2),Ge=Ke([L("sds-details")],Ge);const Ye=d`
1304
+ `}};Fe.styles=[Re],je([S({type:Boolean,reflect:!0})],Fe.prototype,"open",2),je([S({type:Boolean,reflect:!0})],Fe.prototype,"standalone",2),je([S({type:String,reflect:!0})],Fe.prototype,"name",2),Fe=je([L("sds-details")],Fe);const Ie=d`
1338
1305
  :host {
1339
1306
  display: block;
1340
1307
  }
@@ -1361,7 +1328,138 @@ var t;const e=globalThis,s=e.ShadowRoot&&(void 0===e.ShadyCSS||e.ShadyCSS.native
1361
1328
  :host([outlined]) div ::slotted(sds-details:last-child[open]) {
1362
1329
  --sds-details-summary-border-radius: 0;
1363
1330
  }
1364
- `;var Xe=Object.defineProperty,Ze=Object.getOwnPropertyDescriptor,Qe=(t,e,s,o)=>{for(var r,a=o>1?void 0:o?Ze(e,s):e,i=t.length-1;i>=0;i--)(r=t[i])&&(a=(o?r(e,s,a):r(a))||a);return o&&a&&Xe(e,s,a),a};let Je=class extends ft{constructor(){super(...arguments),this.outlined=!1,this._toggleListeners=/* @__PURE__ */new Map}updated(t){t.has("name")&&this._syncChildren()}disconnectedCallback(){super.disconnectedCallback(),this._removeListeners()}_handleSlotChange(){this._syncChildren()}_syncChildren(){this._removeListeners();const t=this._detailsChildren;t.forEach(e=>{if(e.name=this.name,this.name){const s=s=>{const{open:o}=s.detail;o&&t.forEach(t=>{t!==e&&t.open&&(t.open=!1)})};e.addEventListener("toggle",s),this._toggleListeners.set(e,s)}})}_removeListeners(){this._toggleListeners.forEach((t,e)=>{e.removeEventListener("toggle",t)}),this._toggleListeners.clear()}render(){return Q`<div><slot @slotchange="${this._handleSlotChange}"></slot></div>`}};Je.styles=[Ye],Qe([S({type:Boolean,reflect:!0})],Je.prototype,"outlined",2),Qe([S({type:String,reflect:!0})],Je.prototype,"name",2),Qe([O({selector:"sds-details"})],Je.prototype,"_detailsChildren",2),Je=Qe([L("sds-details-group")],Je);const ts=d`
1331
+ `;var He=Object.defineProperty,Ne=Object.getOwnPropertyDescriptor,Ue=(t,e,s,o)=>{for(var r,a=o>1?void 0:o?Ne(e,s):e,i=t.length-1;i>=0;i--)(r=t[i])&&(a=(o?r(e,s,a):r(a))||a);return o&&a&&He(e,s,a),a};let We=class extends ft{constructor(){super(...arguments),this.outlined=!1,this._toggleListeners=/* @__PURE__ */new Map}updated(t){t.has("name")&&this._syncChildren()}disconnectedCallback(){super.disconnectedCallback(),this._removeListeners()}_handleSlotChange(){this._syncChildren()}_syncChildren(){this._removeListeners();const t=this._detailsChildren;t.forEach(e=>{if(e.name=this.name,this.name){const s=s=>{const{open:o}=s.detail;o&&t.forEach(t=>{t!==e&&t.open&&(t.open=!1)})};e.addEventListener("toggle",s),this._toggleListeners.set(e,s)}})}_removeListeners(){this._toggleListeners.forEach((t,e)=>{e.removeEventListener("toggle",t)}),this._toggleListeners.clear()}render(){return Q`<div><slot @slotchange="${this._handleSlotChange}"></slot></div>`}};We.styles=[Ie],Ue([S({type:Boolean,reflect:!0})],We.prototype,"outlined",2),Ue([S({type:String,reflect:!0})],We.prototype,"name",2),Ue([O({selector:"sds-details"})],We.prototype,"_detailsChildren",2),We=Ue([L("sds-details-group")],We);const Ke=d`
1332
+ :host {
1333
+ --_sds-dialog-background-color: var(--sds-dialog-background-color, var(--sds-color-surface-default, var(--sds-color-main-surface-default)));
1334
+ --_sds-dialog-backdrop-color: var(--sds-dialog-backdrop-color, rgba(0, 0, 0, 0.5));
1335
+
1336
+ --_sds-dialog-border-color: var(--sds-dialog-border-color, var(--sds-color-border-subtle, var(--sds-color-main-border-subtle)));
1337
+ --_sds-dialog-border-radius: var(--sds-dialog-border-radius, var(--sds-radius-md));
1338
+ --_sds-dialog-border-width: var(--sds-dialog-border-width, var(--sds-border-sm));
1339
+
1340
+ --_sds-dialog-max-width: var(--sds-dialog-max-width, min(60ch, 100vw));
1341
+ --_sds-dialog-max-height: var(--sds-dialog-max-height, calc(100dvh - var(--sds-spacing-lg)));
1342
+
1343
+ --_sds-dialog-margin: var(--sds-dialog-margin, auto);
1344
+ --_sds-dialog-padding-block: var(--sds-dialog-padding-block, var(--sds-spacing-sm));
1345
+ --_sds-dialog-padding-inline: var(--sds-dialog-padding-inline, var(--sds-spacing-sm));
1346
+ --_sds-dialog-gap: var(--sds-dialog-gap, var(--sds-spacing-xs));
1347
+
1348
+ --_sds-dialog-font-family: var(--sds-dialog-font-family, var(--sds-typography-font-family-roboto));
1349
+ --_sds-dialog-text-color: var(--sds-dialog-text-color, var(--sds-color-text-default, var(--sds-color-main-text-default)));
1350
+
1351
+ --_sds-dialog-box-shadow: var(--sds-dialog-box-shadow, 0 4px 6px -1px rgba(0, 0, 0, 0.1));
1352
+
1353
+ --_sds-dialog-animation-duration: var(--sds-dialog-animation-duration, 200ms);
1354
+ --_sds-dialog-close-button-offset: var(--sds-dialog-close-button-offset, var(--sds-spacing-3xs));
1355
+
1356
+ --_sds-dialog-focus-color: var(--sds-dialog-focus-color, var(--sds-color-states-focus-outer));
1357
+ --_sds-dialog-focus-inner-color: var(--sds-dialog-focus-inner-color, var(--sds-color-states-focus-inner));
1358
+ --_sds-dialog-focus-spacing: var(--sds-dialog-focus-spacing, var(--sds-color-states-focus-spacing));
1359
+ --_sds-dialog-focus-outline-size: var(--sds-dialog-focus-outline-size, var(--sds-color-states-focus-outline-size));
1360
+
1361
+ display: contents;
1362
+ }
1363
+
1364
+ dialog {
1365
+ color: var(--_sds-dialog-text-color);
1366
+ background-color: var(--_sds-dialog-background-color);
1367
+ box-shadow: var(--_sds-dialog-box-shadow);
1368
+
1369
+ border: var(--_sds-dialog-border-width) solid var(--_sds-dialog-border-color);
1370
+ border-radius: var(--_sds-dialog-border-radius);
1371
+
1372
+ font-family: var(--_sds-dialog-font-family);
1373
+
1374
+ max-width: var(--_sds-dialog-max-width);
1375
+ max-height: var(--_sds-dialog-max-height);
1376
+
1377
+ overflow: auto;
1378
+ padding: 0;
1379
+
1380
+ opacity: 0;
1381
+ transform: translateY(-1rem);
1382
+ animation: sds-dialog-fade-in var(--_sds-dialog-animation-duration) ease-out forwards;
1383
+
1384
+ &:focus-visible {
1385
+ box-shadow: 0 0 0 var(--_sds-dialog-focus-spacing) var(--_sds-dialog-focus-inner-color);
1386
+ outline: var(--_sds-dialog-focus-outline-size) solid var(--_sds-dialog-focus-color);
1387
+ outline-offset: var(--_sds-dialog-focus-spacing);
1388
+ }
1389
+
1390
+ &[open] {
1391
+ display: flex;
1392
+ flex-direction: column;
1393
+ margin: var(--_sds-dialog-margin);
1394
+ padding-block: var(--_sds-dialog-padding-block);
1395
+ padding-inline: var(--_sds-dialog-padding-inline);
1396
+ gap: var(--_sds-dialog-gap);
1397
+ }
1398
+
1399
+ &.sds-dialog__empty-header:has(.sds-dialog__close-button) {
1400
+ /* Set padding right to avoid overflowing the close button */
1401
+ padding-right: var(--sds-dialog-padding-right, var(--sds-spacing-lg));
1402
+ }
1403
+
1404
+ &::backdrop {
1405
+ background-color: var(--_sds-dialog-backdrop-color);
1406
+ /* @keyframes does not work for ::backdrop in Firefox, so use transition instead */
1407
+ transition: opacity var(--_sds-dialog-animation-duration) ease-out;
1408
+ opacity: 0;
1409
+ }
1410
+
1411
+ &[open]::backdrop {
1412
+ opacity: 1;
1413
+ }
1414
+ }
1415
+
1416
+ @keyframes sds-dialog-fade-in {
1417
+ to {
1418
+ opacity: 1;
1419
+ transform: translateY(0);
1420
+ }
1421
+ }
1422
+
1423
+ .sds-dialog__close-button {
1424
+ --sds-button-text-color: var(--sds-dialog-close-button-color, var(--sds-color-text-subtle, var(--sds-color-main-text-subtle)));
1425
+ --sds-button-padding-inline: 0;
1426
+
1427
+ position: absolute;
1428
+ top: var(--_sds-dialog-close-button-offset);
1429
+ right: var(--_sds-dialog-close-button-offset);
1430
+ z-index: 1;
1431
+ }
1432
+
1433
+ .sds-dialog__header {
1434
+ margin-right: var(--sds-spacing-lg);
1435
+ }
1436
+
1437
+ @media (max-width: 640px) {
1438
+ :host {
1439
+ --_sds-dialog-max-width: var(--sds-dialog-max-width, 100%);
1440
+ --_sds-dialog-margin: var(--sds-dialog-margin, var(--sds-spacing-xs));
1441
+ }
1442
+ }
1443
+
1444
+ @media (prefers-reduced-motion: reduce) {
1445
+ :host {
1446
+ --_sds-dialog-animation-duration: 0ms;
1447
+ }
1448
+ }
1449
+ `;var Ge=Object.defineProperty,Ye=(t,e,s,o)=>{for(var r,a=void 0,i=t.length-1;i>=0;i--)(r=t[i])&&(a=r(e,s,a)||a);return a&&Ge(e,s,a),a};const Xe=class extends(St(ft)){constructor(){super(...arguments),this.open=!1,this.modal=!1,this.closedby="closerequest",this.closeButtonLabel="Lukk dialogvindu",this._isHeaderSlotEmpty=!0,this._pointerDownInside=!1,this._handleClose=()=>{this.open=!1,this.dispatchSheriffEvent("sds-close")},this._handleClick=t=>{const e=t.target;e?.closest('[data-command="close"],[command="close"]')&&this._closeDialog()},this._handlePointerDown=t=>{const e=this._dialog.getBoundingClientRect(),{clientX:s,clientY:o}=t;this._pointerDownInside=e.top<=o&&o<=e.bottom&&e.left<=s&&s<=e.right},this._handlePointerUp=t=>{const e=this._pointerDownInside;this._pointerDownInside=!1,"any"!==this.closedby||e||t.target===this._dialog&&requestAnimationFrame(()=>{this._dialog&&this._dialog.open&&this._closeDialog()})},this._handleCancel=t=>{"none"===this.closedby&&t.preventDefault()},this._handleHeaderSlotChange=t=>{const e=t.target;this._isHeaderSlotEmpty=0===e.assignedElements().length},this._handleAutoFocus=()=>{const t=this.shadowRoot?.querySelector("slot:not([name])")?.assignedElements({flatten:!0});if(!t||0===t.length)return;const e=t.find(t=>null!=t.getAttribute("autofocus"));e instanceof HTMLElement&&document.activeElement!==e&&e.focus()}}firstUpdated(){this._setupEventListeners(),this.open&&this._openDialog()}updated(t){t.has("open")&&(this.open?this._openDialog():this._closeDialog())}_setupEventListeners(){this._dialog.addEventListener("close",this._handleClose),this._dialog.addEventListener("cancel",this._handleCancel),this._dialog.addEventListener("click",this._handleClick),this._dialog.addEventListener("pointerdown",this._handlePointerDown),this._dialog.addEventListener("pointerup",this._handlePointerUp),this._dialog.addEventListener("animationend",this._handleAutoFocus)}_openDialog(){this._dialog&&(this.modal?this._dialog.showModal():this._dialog.show())}_closeDialog(){this._dialog&&this._dialog.close()}show(){this.open=!0}showModal(){this.modal=!0,this.open=!0}close(){this.open=!1}requestClose(){this._dialog&&this._dialog.requestClose()}render(){return Q`
1450
+ <dialog .closedBy="${this.closedby}" class=${this._isHeaderSlotEmpty?"sds-dialog__empty-header":""}>
1451
+ <div class="sds-dialog__header">
1452
+ <slot name="header" @slotchange=${this._handleHeaderSlotChange}></slot>
1453
+ ${this.closeButtonLabel?Q`
1454
+ <sds-button class="sds-dialog__close-button" icon variant="tertiary" size="md" command="close" label="${this.closeButtonLabel}">
1455
+ <sds-icon name="close-material-outlined" size="md"></sds-icon>
1456
+ </sds-button>
1457
+ `:tt}
1458
+ </div>
1459
+ <slot></slot>
1460
+ <slot name="footer"></slot>
1461
+ </dialog>
1462
+ `}};Xe.styles=[Ke];let Ze=Xe;Ye([S({type:Boolean,reflect:!0})],Ze.prototype,"open"),Ye([S({type:Boolean,reflect:!0})],Ze.prototype,"modal"),Ye([S({type:String,reflect:!0})],Ze.prototype,"closedby"),Ye([S({type:String,attribute:"close-button-label"})],Ze.prototype,"closeButtonLabel"),Ye([A("dialog")],Ze.prototype,"_dialog"),Ye([C()],Ze.prototype,"_isHeaderSlotEmpty");var Qe=Object.getOwnPropertyDescriptor;let Je=class extends Ze{};Je=((t,e,s,o)=>{for(var r,a=o>1?void 0:o?Qe(e,s):e,i=t.length-1;i>=0;i--)(r=t[i])&&(a=r(a)||a);return a})([L("sds-dialog")],Je);const ts=d`
1365
1463
  :host {
1366
1464
  --_sds-heading-font-family: var(--sds-heading-font-family, var(--sds-typography-font-family-roboto));
1367
1465
  --_sds-heading-text-color: var(--sds-heading-text-color, var(--sds-color-text-default, var(--sds-color-neutral-text-default)));
@@ -1984,6 +2082,12 @@ var t;const e=globalThis,s=e.ShadowRoot&&(void 0===e.ShadyCSS||e.ShadyCSS.native
1984
2082
  --_sds-radio-input-dot-color: var(--sds-radio-input-dot-color, transparent);
1985
2083
  --_sds-radio-input-dot-size: var(--sds-radio-input-dot-size, 4.5px);
1986
2084
 
2085
+ --_sds-radio-focus-color-outer: var(--sds-radio-focus-color-outer, var(--sds-color-states-focus-outer));
2086
+ --_sds-radio-focus-color-inner: var(--sds-radio-focus-color-inner, var(--sds-color-states-focus-inner));
2087
+ --_sds-radio-focus-spacing: var(--sds-radio-focus-spacing, var(--sds-color-states-focus-spacing));
2088
+ --_sds-radio-focus-outline-size: var(--sds-radio-focus-outline-size, var(--sds-color-states-focus-outline-size));
2089
+ --_sds-radio-focus-radius: var(--sds-radio-focus-radius, var(--sds-radius-xs));
2090
+
1987
2091
  --_sds-radio-grid-template-areas: var(--sds-radio-grid-template-area, 'input content');
1988
2092
  --_sds-radio-label-grid-area: var(--sds-radio-label-grid-area, content);
1989
2093
  --_sds-radio-input-grid-area: var(--sds-radio-input-grid-area, input);
@@ -2008,9 +2112,10 @@ var t;const e=globalThis,s=e.ShadowRoot&&(void 0===e.ShadyCSS||e.ShadyCSS.native
2008
2112
  }
2009
2113
 
2010
2114
  &:has(:focus-visible) {
2011
- outline: 3px solid var(--sds-color-states-focus-outer);
2012
- outline-offset: 6px;
2013
- border-radius: var(--sds-radius-sm);
2115
+ box-shadow: 0 0 0 var(--_sds-radio-focus-spacing) var(--_sds-radio-focus-color-inner);
2116
+ outline: var(--_sds-radio-focus-outline-size) solid var(--_sds-radio-focus-color-outer);
2117
+ outline-offset: var(--_sds-radio-focus-spacing);
2118
+ border-radius: var(--_sds-radio-focus-radius);
2014
2119
  }
2015
2120
  }
2016
2121
 
@@ -2331,6 +2436,7 @@ var t;const e=globalThis,s=e.ShadowRoot&&(void 0===e.ShadyCSS||e.ShadyCSS.native
2331
2436
  --_sds-select-focus-color: var(--sds-select-focus-color, var(--sds-color-states-focus-outer));
2332
2437
  --_sds-select-focus-inner-color: var(--sds-select-focus-inner-color, var(--sds-color-states-focus-inner));
2333
2438
  --_sds-select-focus-spacing: var(--sds-select-focus-spacing, var(--sds-color-states-focus-spacing));
2439
+ --_sds-select-focus-outline-size: var(--sds-select-focus-outline-size, var(--sds-color-states-focus-outline-size));
2334
2440
 
2335
2441
  --_sds-select-error-border-color: var(--sds-select-error-border-color, var(--sds-color-alert-danger-border-default, var(--sds-color-neutral-border-strong)));
2336
2442
  --_sds-select-error-text-color: var(--sds-select-error-text-color, var(--sds-color-alert-danger-text-default, var(--sds-color-neutral-text-default)));
@@ -2401,8 +2507,8 @@ var t;const e=globalThis,s=e.ShadowRoot&&(void 0===e.ShadyCSS||e.ShadyCSS.native
2401
2507
  }
2402
2508
 
2403
2509
  &:focus-visible {
2404
- box-shadow: 0 0 0 var(--sds-color-states-focus-spacing) var(--_sds-select-focus-inner-color);
2405
- outline: var(--_sds-select-focus-spacing) solid var(--_sds-select-focus-color);
2510
+ box-shadow: 0 0 0 var(--_sds-select-focus-spacing) var(--_sds-select-focus-inner-color);
2511
+ outline: var(--_sds-select-focus-outline-size) solid var(--_sds-select-focus-color);
2406
2512
  outline-offset: var(--_sds-select-focus-spacing);
2407
2513
  }
2408
2514
 
@@ -2597,6 +2703,7 @@ var t;const e=globalThis,s=e.ShadowRoot&&(void 0===e.ShadyCSS||e.ShadyCSS.native
2597
2703
  --_sds-stepper-step-focus-color: var(--sds-stepper-step-focus-color, var(--sds-color-states-focus-outer));
2598
2704
  --_sds-stepper-step-focus-inner-color: var(--sds-stepper-step-focus-inner-color, var(--sds-color-states-focus-inner));
2599
2705
  --_sds-stepper-step-focus-spacing: var(--sds-stepper-step-focus-spacing, var(--sds-color-states-focus-spacing));
2706
+ --_sds-stepper-step-focus-outline-size: var(--sds-stepper-step-focus-outline-size, var(--sds-color-states-focus-outline-size));
2600
2707
 
2601
2708
  width: fit-content;
2602
2709
  }
@@ -2668,9 +2775,9 @@ var t;const e=globalThis,s=e.ShadowRoot&&(void 0===e.ShadyCSS||e.ShadyCSS.native
2668
2775
  cursor: pointer;
2669
2776
 
2670
2777
  &:focus-visible {
2671
- box-shadow: 0 0 0 var(--sds-color-states-focus-spacing) var(--_sds-stepper-step-focus-inner-color);
2672
- outline: 3px solid var(--_sds-stepper-step-focus-color);
2673
- outline-offset: 3px;
2778
+ box-shadow: 0 0 0 var(--_sds-stepper-step-focus-spacing) var(--_sds-stepper-step-focus-inner-color);
2779
+ outline: var(--_sds-stepper-step-focus-outline-size) solid var(--_sds-stepper-step-focus-color);
2780
+ outline-offset: var(--_sds-stepper-step-focus-spacing);
2674
2781
  isolation: isolate;
2675
2782
  }
2676
2783
  }
@@ -2838,9 +2945,9 @@ var t;const e=globalThis,s=e.ShadowRoot&&(void 0===e.ShadyCSS||e.ShadyCSS.native
2838
2945
  --_sds-switch-button-position: var(--sds-switch-button-position, calc(var(--_sds-switch-button-gap) - var(--_sds-switch-border-width)));
2839
2946
  --_sds-switch-button-radius: var(--sds-switch-button-radius, var(--sds-radius-full));
2840
2947
 
2841
- --_sds-switch-focus-outline-width: var(--sds-switch-focus-outline-width, var(--sds-border-md));
2842
- --_sds-switch-focus-outline-color: var(--sds-switch-focus-outline-color, var(--sds-color-states-focus-outer));
2843
- --_sds-switch-focus-outline-offset: var(--sds-switch-focus-outline-offset, var(--sds-color-states-focus-spacing));
2948
+ --_sds-switch-focus-outline-size: var(--sds-switch-focus-outline-size, var(--sds-switch-focus-outline-width, var(--sds-color-states-focus-outline-size)));
2949
+ --_sds-switch-focus-color: var(--sds-switch-focus-color, var(--sds-switch-focus-outline-color, var(--sds-color-states-focus-outer)));
2950
+ --_sds-switch-focus-spacing: var(--sds-switch-focus-spacing, var(--sds-switch-focus-outline-offset, var(--sds-color-states-focus-spacing)));
2844
2951
  --_sds-switch-focus-inner-color: var(--sds-switch-focus-inner-color, var(--sds-color-states-focus-inner));
2845
2952
 
2846
2953
  --_sds-switch-disabled-opacity: var(--sds-switch-disabled-opacity, var(--sds-color-states-disabled-opacity));
@@ -2947,9 +3054,9 @@ var t;const e=globalThis,s=e.ShadowRoot&&(void 0===e.ShadyCSS||e.ShadyCSS.native
2947
3054
  }
2948
3055
 
2949
3056
  .sds-switch__input:focus-visible {
2950
- box-shadow: 0 0 0 var(--sds-color-states-focus-spacing) var(--_sds-switch-focus-inner-color);
2951
- outline: var(--_sds-switch-focus-outline-width) solid var(--_sds-switch-focus-outline-color);
2952
- outline-offset: var(--_sds-switch-focus-outline-offset);
3057
+ box-shadow: 0 0 0 var(--_sds-switch-focus-spacing) var(--_sds-switch-focus-inner-color);
3058
+ outline: var(--_sds-switch-focus-outline-size) solid var(--_sds-switch-focus-color);
3059
+ outline-offset: var(--_sds-switch-focus-spacing);
2953
3060
  }
2954
3061
 
2955
3062
  .sds-switch__input:checked:not([readonly]) {
@@ -3130,6 +3237,7 @@ var t;const e=globalThis,s=e.ShadowRoot&&(void 0===e.ShadyCSS||e.ShadyCSS.native
3130
3237
  --_sds-text-text-decoration: var(--sds-text-text-decoration, inherit);
3131
3238
  --_sds-text-text-decoration-thickness: var(--sds-text-text-decoration-thickness, var(--sds-typography-link-text-decoration-thickness));
3132
3239
  --_sds-text-text-underline-offset: var(--sds-text-text-underline-offset, var(--sds-typography-link-text-underline-offset));
3240
+ --_sds-text-max-width: var(--sds-text-max-width, var(--sds-typography-max-line-width, 60ch));
3133
3241
 
3134
3242
  display: block;
3135
3243
  box-sizing: border-box;
@@ -3147,7 +3255,7 @@ var t;const e=globalThis,s=e.ShadowRoot&&(void 0===e.ShadyCSS||e.ShadyCSS.native
3147
3255
  text-underline-offset: var(--_sds-text-text-underline-offset);
3148
3256
  margin: 0;
3149
3257
  padding: 0;
3150
- max-width: var(--sds-typography-max-line-width);
3258
+ max-width: var(--_sds-text-max-width);
3151
3259
  }
3152
3260
 
3153
3261
  :host([data-palette]) {
@@ -3569,6 +3677,7 @@ var t;const e=globalThis,s=e.ShadowRoot&&(void 0===e.ShadyCSS||e.ShadyCSS.native
3569
3677
  --_sds-textfield-focus-color: var(--sds-textfield-focus-color, var(--sds-color-states-focus-outer));
3570
3678
  --_sds-textfield-focus-inner-color: var(--sds-textfield-focus-inner-color, var(--sds-color-states-focus-inner));
3571
3679
  --_sds-textfield-focus-spacing: var(--sds-textfield-focus-spacing, var(--sds-color-states-focus-spacing));
3680
+ --_sds-textfield-focus-outline-size: var(--sds-textfield-focus-outline-size, var(--sds-color-states-focus-outline-size));
3572
3681
 
3573
3682
  --_sds-textfield-cursor: var(--sds-textfield-cursor, auto);
3574
3683
 
@@ -3612,9 +3721,9 @@ var t;const e=globalThis,s=e.ShadowRoot&&(void 0===e.ShadyCSS||e.ShadyCSS.native
3612
3721
  }
3613
3722
 
3614
3723
  &:focus-visible {
3615
- box-shadow: 0 0 0 var(--sds-color-states-focus-spacing) var(--_sds-textfield-focus-inner-color);
3616
- outline: 3px solid var(--_sds-textfield-focus-color);
3617
- outline-offset: 3px;
3724
+ box-shadow: 0 0 0 var(--_sds-textfield-focus-spacing) var(--_sds-textfield-focus-inner-color);
3725
+ outline: var(--_sds-textfield-focus-outline-size) solid var(--_sds-textfield-focus-color);
3726
+ outline-offset: var(--_sds-textfield-focus-spacing);
3618
3727
  }
3619
3728
  }
3620
3729
 
@@ -3705,7 +3814,7 @@ var t;const e=globalThis,s=e.ShadowRoot&&(void 0===e.ShadyCSS||e.ShadyCSS.native
3705
3814
  --sds-icon-size: var(--sds-textfield-icon-size, var(--sds-components-icon-lg));
3706
3815
  }
3707
3816
  }
3708
- `;var na=Object.defineProperty,la=Object.getOwnPropertyDescriptor,ca=(t,e,s,o)=>{for(var r,a=o>1?void 0:o?la(e,s):e,i=t.length-1;i>=0;i--)(r=t[i])&&(a=(o?r(e,s,a):r(a))||a);return o&&a&&na(e,s,a),a};let ha=class extends(Jt(St(se(ft)))){constructor(){super(...arguments),this.type="text",this.required=!1,this.size="md",this.hasIcon=!1,this._defaultValue=null,this.handleSlotChange=t=>{const e=t.target;this.hasIcon=e.assignedNodes({flatten:!0}).length>0},this._handleInputChange=t=>{t.stopImmediatePropagation(),!this.disabled&&t.target instanceof HTMLInputElement&&(this.value=t.target.value,this.internals.setFormValue(""===this.value?null:this.value),this.updateValidity(),this.dispatchSheriffEvent(t.type))},this._handleSelect=t=>{t.stopImmediatePropagation(),this.disabled||this.dispatchSheriffEvent("select")},this._handleFocus=t=>{t.stopImmediatePropagation(),this.dispatchSheriffEvent("focus")},this._handleBlur=t=>{t.stopImmediatePropagation(),this.updateValidity(),this.dispatchSheriffEvent("blur")},this._handleKeyDown=t=>{t.stopImmediatePropagation();if(this.dispatchKeyboardEvent("keydown",t)&&"Enter"===t.key){const t=this.form;t?.requestSubmit?t.requestSubmit():t?.submit()}}}connectedCallback(){super.connectedCallback(),this._defaultValue=this.value??null,this.internals.setFormValue(this._defaultValue)}updated(t){super.updated(t),t.has("value")&&(this.internals.setFormValue(this.value??""),this.control&&(this.control.value=this.value??""))}updateValidity(){this.control.checkValidity()?this.internals.setValidity({}):this.internals.setValidity({customError:!0},this.control.validationMessage,this.control)}formResetCallback(){this.internals.setFormValue(this._defaultValue);const t=this._defaultValue??"";this.control.value=t,this.value=t,this.updateValidity()}select(){this.disabled||this.control.select()}get selectionStart(){return this.control?this.control.selectionStart:null}set selectionStart(t){this.control&&null!==t&&(this.control.selectionStart=t)}get selectionEnd(){return this.control?this.control.selectionEnd:null}set selectionEnd(t){this.control&&null!==t&&(this.control.selectionEnd=t)}setSelectionRange(t,e,s){this.control&&this.control.setSelectionRange(t,e,s)}checkValidity(){return this.control.checkValidity()}reportValidity(){return this.control.reportValidity()}setCustomValidity(t){this.control.setCustomValidity(t),this.updateValidity()}render(){const t={"sds-textfield":!0,"sds-textfield--error":Boolean(this.errorMessage),"sds-textfield--has-icon":this.hasIcon},e=[this.errorMessage?"error-message":null,this.helpText?"help-text":null].filter(Boolean).join(" ")||void 0;return Q`
3817
+ `;var na=Object.defineProperty,la=Object.getOwnPropertyDescriptor,ca=(t,e,s,o)=>{for(var r,a=o>1?void 0:o?la(e,s):e,i=t.length-1;i>=0;i--)(r=t[i])&&(a=(o?r(e,s,a):r(a))||a);return o&&a&&na(e,s,a),a};let ha=class extends(Jt(St(se(ft)))){constructor(){super(...arguments),this.type="text",this.required=!1,this.size="md",this.hasIcon=!1,this._defaultValue=null,this.handleSlotChange=t=>{const e=t.target;this.hasIcon=e.assignedNodes({flatten:!0}).length>0},this._handleInputChange=t=>{t.stopImmediatePropagation(),!this.disabled&&t.target instanceof HTMLInputElement&&(this.value=t.target.value,this.internals.setFormValue(""===this.value?null:this.value),this.updateValidity(),this.dispatchSheriffEvent(t.type))},this._handleSelect=t=>{t.stopImmediatePropagation(),this.disabled||this.dispatchSheriffEvent("select")},this._handleFocus=t=>{t.stopImmediatePropagation(),this.dispatchSheriffEvent("focus")},this._handleBlur=t=>{t.stopImmediatePropagation(),this.updateValidity(),this.dispatchSheriffEvent("blur")},this._handleKeyDown=t=>{t.stopImmediatePropagation();if(this.dispatchKeyboardEvent("keydown",t)&&"Enter"===t.key){for(const t of Array.from(this.form?.elements??[]))if(t instanceof HTMLButtonElement||t instanceof HTMLInputElement){if("submit"!==t.type)continue;if(t.disabled)return;return void t.click()}this.form?.requestSubmit()}}}connectedCallback(){super.connectedCallback(),this._defaultValue=this.value??null,this.internals.setFormValue(this._defaultValue)}updated(t){super.updated(t),t.has("value")&&(this.internals.setFormValue(this.value??""),this.control&&(this.control.value=this.value??""))}updateValidity(){this.control&&(this.control.checkValidity()?this.internals.setValidity({}):this.internals.setValidity({customError:!0},this.control.validationMessage,this.control))}formResetCallback(){this.internals.setFormValue(this._defaultValue);const t=this._defaultValue??"";this.control.value=t,this.value=t,this.updateValidity()}select(){this.disabled||this.control.select()}get selectionStart(){return this.control?this.control.selectionStart:null}set selectionStart(t){this.control&&null!==t&&(this.control.selectionStart=t)}get selectionEnd(){return this.control?this.control.selectionEnd:null}set selectionEnd(t){this.control&&null!==t&&(this.control.selectionEnd=t)}setSelectionRange(t,e,s){this.control&&this.control.setSelectionRange(t,e,s)}checkValidity(){return this.control.checkValidity()}reportValidity(){return this.control.reportValidity()}setCustomValidity(t){this.control.setCustomValidity(t),this.updateValidity()}render(){const t={"sds-textfield":!0,"sds-textfield--error":Boolean(this.errorMessage),"sds-textfield--has-icon":this.hasIcon},e=[this.errorMessage?"error-message":null,this.helpText?"help-text":null].filter(Boolean).join(" ")||void 0;return Q`
3709
3818
  <div class="${Zt(t)}">
3710
3819
  ${this.label?Q`<label for="sds-textfield" class="sds-textfield__label">${this.readOnly?Q`<sds-icon name="lock-material-filled" size="m"></sds-icon>`:tt}</sds-icon>${this.label}</label>`:tt}
3711
3820
  ${this.helpText?Q`<p id="help-text" class="sds-textfield__help-text">${this.helpText}</p>`:tt}
@@ -3723,7 +3832,9 @@ var t;const e=globalThis,s=e.ShadowRoot&&(void 0===e.ShadyCSS||e.ShadyCSS.native
3723
3832
  autocomplete="${Pt(this.autocomplete)}"
3724
3833
  ?required="${this.required}"
3725
3834
  pattern="${Pt(this.pattern)}"
3835
+ min="${Pt(this.min)}"
3726
3836
  minlength="${Pt(this.minlength)}"
3837
+ max="${Pt(this.max)}"
3727
3838
  maxlength="${Pt(this.maxlength)}"
3728
3839
  aria-describedby="${Pt(e)}"
3729
3840
  aria-invalid="${this.errorMessage?"true":"false"}"
@@ -3738,7 +3849,7 @@ var t;const e=globalThis,s=e.ShadowRoot&&(void 0===e.ShadyCSS||e.ShadyCSS.native
3738
3849
  </div>
3739
3850
  ${this.errorMessage?Q`<sds-alert id="error-message" variant="secondary" data-palette="danger"><p slot="message">${this.errorMessage}</p></sds-alert>`:tt}
3740
3851
  </div>
3741
- `}};ha.styles=[da],ca([S({type:String,reflect:!0})],ha.prototype,"type",2),ca([S({type:String})],ha.prototype,"value",2),ca([S({type:String,reflect:!0})],ha.prototype,"label",2),ca([S({type:String,reflect:!0})],ha.prototype,"placeholder",2),ca([S({type:String,attribute:"help-text",reflect:!0})],ha.prototype,"helpText",2),ca([S({type:String,attribute:"error-message",reflect:!0})],ha.prototype,"errorMessage",2),ca([S({type:String,reflect:!0})],ha.prototype,"autocomplete",2),ca([S({type:Boolean,reflect:!0})],ha.prototype,"required",2),ca([S({type:String,reflect:!0})],ha.prototype,"pattern",2),ca([S({type:Number,reflect:!0})],ha.prototype,"minlength",2),ca([S({type:Number,reflect:!0})],ha.prototype,"maxlength",2),ca([S({type:String,reflect:!0})],ha.prototype,"size",2),ca([C()],ha.prototype,"hasIcon",2),ca([A("#sds-textfield")],ha.prototype,"control",2),ha=ca([L("sds-textfield")],ha);const pa=d`
3852
+ `}};ha.styles=[da],ca([S({type:String,reflect:!0})],ha.prototype,"type",2),ca([S({type:String})],ha.prototype,"value",2),ca([S({type:String,reflect:!0})],ha.prototype,"label",2),ca([S({type:String,reflect:!0})],ha.prototype,"placeholder",2),ca([S({type:String,attribute:"help-text",reflect:!0})],ha.prototype,"helpText",2),ca([S({type:String,attribute:"error-message",reflect:!0})],ha.prototype,"errorMessage",2),ca([S({type:String,reflect:!0})],ha.prototype,"autocomplete",2),ca([S({type:Boolean,reflect:!0})],ha.prototype,"required",2),ca([S({type:String,reflect:!0})],ha.prototype,"pattern",2),ca([S({type:Number,reflect:!0})],ha.prototype,"minlength",2),ca([S({type:Number,reflect:!0})],ha.prototype,"maxlength",2),ca([S({type:String,reflect:!0})],ha.prototype,"min",2),ca([S({type:String,reflect:!0})],ha.prototype,"max",2),ca([S({type:String,reflect:!0})],ha.prototype,"size",2),ca([C()],ha.prototype,"hasIcon",2),ca([A("#sds-textfield")],ha.prototype,"control",2),ha=ca([L("sds-textfield")],ha);const pa=d`
3742
3853
  :host {
3743
3854
  --_sds-textarea-background-color: var(--sds-textarea-background-color, var(--sds-color-background-default, var(--sds-color-neutral-background-default)));
3744
3855
  --_sds-textarea-text-color: var(--sds-textarea-text-color, var(--sds-color-text-default, var(--sds-color-neutral-text-default)));
@@ -3781,6 +3892,7 @@ var t;const e=globalThis,s=e.ShadowRoot&&(void 0===e.ShadyCSS||e.ShadyCSS.native
3781
3892
  --_sds-textarea-focus-color: var(--sds-textarea-focus-color, var(--sds-color-states-focus-outer));
3782
3893
  --_sds-textarea-focus-inner-color: var(--sds-textarea-focus-inner-color, var(--sds-color-states-focus-inner));
3783
3894
  --_sds-textarea-focus-spacing: var(--sds-textarea-focus-spacing, var(--sds-color-states-focus-spacing));
3895
+ --_sds-textarea-focus-outline-size: var(--sds-textarea-focus-outline-size, var(--sds-color-states-focus-outline-size));
3784
3896
 
3785
3897
  all: unset;
3786
3898
  display: block;
@@ -3821,9 +3933,9 @@ var t;const e=globalThis,s=e.ShadowRoot&&(void 0===e.ShadyCSS||e.ShadyCSS.native
3821
3933
  }
3822
3934
 
3823
3935
  &:focus-visible {
3824
- box-shadow: 0 0 0 var(--sds-color-states-focus-spacing) var(--_sds-textarea-focus-inner-color);
3825
- outline: 3px solid var(--_sds-textarea-focus-color);
3826
- outline-offset: 3px;
3936
+ box-shadow: 0 0 0 var(--_sds-textarea-focus-spacing) var(--_sds-textarea-focus-inner-color);
3937
+ outline: var(--_sds-textarea-focus-outline-size) solid var(--_sds-textarea-focus-color);
3938
+ outline-offset: var(--_sds-textarea-focus-spacing);
3827
3939
  }
3828
3940
 
3829
3941
  &:active {
@@ -3841,6 +3953,13 @@ var t;const e=globalThis,s=e.ShadowRoot&&(void 0===e.ShadyCSS||e.ShadyCSS.native
3841
3953
  max-width: var(--sds-typography-max-line-width);
3842
3954
  }
3843
3955
 
3956
+ .sds-textarea__label:has(sds-icon) {
3957
+ align-items: center;
3958
+ display: flex;
3959
+ flex-direction: row;
3960
+ gap: var(--_sds-textarea-gap);
3961
+ }
3962
+
3844
3963
  .sds-textarea__help-text {
3845
3964
  color: var(--_sds-textarea-helptext-text-color);
3846
3965
  font-size: var(--_sds-textarea-helptext-font-size);
@@ -3925,12 +4044,12 @@ var t;const e=globalThis,s=e.ShadowRoot&&(void 0===e.ShadyCSS||e.ShadyCSS.native
3925
4044
  --_sds-textarea-counter-font-size: var(--sds-textarea-counter-font-size, var(--sds-components-font-size-content-lg));
3926
4045
  --_sds-textarea-counter-line-height: var(--sds-textarea-counter-line-height, var(--sds-components-line-height-squeezed-lg));
3927
4046
  }
3928
- `;var ga=Object.defineProperty,va=Object.getOwnPropertyDescriptor,ua=(t,e,s,o)=>{for(var r,a=o>1?void 0:o?va(e,s):e,i=t.length-1;i>=0;i--)(r=t[i])&&(a=(o?r(e,s,a):r(a))||a);return o&&a&&ga(e,s,a),a};let fa=class extends(Jt(St(se(ft)))){constructor(){super(...arguments),this.required=!1,this.size="md",this._defaultValue=null,this._handleInputChange=t=>{t.stopImmediatePropagation(),!this.disabled&&t.target instanceof HTMLTextAreaElement&&(this.value=t.target.value,this.internals.setFormValue(""===this.value?null:this.value),this.updateValidity(),this.dispatchSheriffEvent(t.type))},this._handleSelect=t=>{t.stopImmediatePropagation(),this.disabled||this.dispatchSheriffEvent("select")},this._handleFocus=t=>{t.stopImmediatePropagation(),this.dispatchSheriffEvent("focus")},this._handleBlur=t=>{t.stopImmediatePropagation(),this.updateValidity(),this.dispatchSheriffEvent("blur")}}connectedCallback(){super.connectedCallback(),this._defaultValue=this.value??null,this.internals.setFormValue(this._defaultValue)}updated(t){super.updated(t),t.has("value")&&(this.internals.setFormValue(this.value??""),this.control&&(this.control.value=this.value??""))}updateValidity(){this.control.checkValidity()?this.internals.setValidity({}):this.internals.setValidity({customError:!0},this.control.validationMessage,this.control)}hasTypedTooManyCharacters(){if(!this.counter)return!1;return(this.value?.length||0)>this.counter}renderCharacterCounter(){if(void 0===this.counter)return tt;const t=this.value?.length||0;return this.hasTypedTooManyCharacters()?Q`<sds-alert variant="secondary" data-palette="danger"
4047
+ `;var ga=Object.defineProperty,va=Object.getOwnPropertyDescriptor,ua=(t,e,s,o)=>{for(var r,a=o>1?void 0:o?va(e,s):e,i=t.length-1;i>=0;i--)(r=t[i])&&(a=(o?r(e,s,a):r(a))||a);return o&&a&&ga(e,s,a),a};let fa=class extends(Jt(St(se(ft)))){constructor(){super(...arguments),this.required=!1,this.size="md",this._defaultValue=null,this._handleInputChange=t=>{t.stopImmediatePropagation(),!this.disabled&&t.target instanceof HTMLTextAreaElement&&(this.value=t.target.value,this.internals.setFormValue(""===this.value?null:this.value),this.updateValidity(),this.dispatchSheriffEvent(t.type))},this._handleSelect=t=>{t.stopImmediatePropagation(),this.disabled||this.dispatchSheriffEvent("select")},this._handleFocus=t=>{t.stopImmediatePropagation(),this.dispatchSheriffEvent("focus")},this._handleBlur=t=>{t.stopImmediatePropagation(),this.updateValidity(),this.dispatchSheriffEvent("blur")}}connectedCallback(){super.connectedCallback(),this._defaultValue=this.value??null,this.internals.setFormValue(this._defaultValue)}updated(t){super.updated(t),t.has("value")&&(this.internals.setFormValue(this.value??""),this.control&&(this.control.value=this.value??""))}updateValidity(){this.control&&(this.control.checkValidity()?this.internals.setValidity({}):this.internals.setValidity({customError:!0},this.control.validationMessage,this.control))}hasTypedTooManyCharacters(){if(!this.counter)return!1;return(this.value?.length||0)>this.counter}renderCharacterCounter(){if(void 0===this.counter)return tt;const t=this.value?.length||0;return this.hasTypedTooManyCharacters()?Q`<sds-alert variant="secondary" data-palette="danger"
3929
4048
  ><p class="sds-textarea__character-counter" slot="message">Du har ${t-this.counter} tegn for mye</p></sds-alert
3930
4049
  >`:Q`<p class="sds-textarea__character-counter">Du har ${this.counter-t} tegn igjen</p>`}formResetCallback(){this.internals.setFormValue(this._defaultValue);const t=this._defaultValue??"";this.control.value=t,this.value=t,this.updateValidity()}select(){this.disabled||this.control.select()}type(){return"textarea"}get selectionStart(){return this.control?this.control.selectionStart:null}set selectionStart(t){this.control&&null!==t&&(this.control.selectionStart=t)}get selectionEnd(){return this.control?this.control.selectionEnd:null}set selectionEnd(t){this.control&&null!==t&&(this.control.selectionEnd=t)}setSelectionRange(t,e,s){this.control&&this.control.setSelectionRange(t,e,s)}checkValidity(){return this.control.checkValidity()}reportValidity(){return this.control.reportValidity()}setCustomValidity(t){this.control.setCustomValidity(t),this.updateValidity()}render(){const t=Boolean(this.errorMessage||this.hasTypedTooManyCharacters()),e={"sds-textarea":!0,"sds-textarea--error":t},s=[this.errorMessage?"error-message":null,this.helpText?"help-text":null].filter(Boolean).join(" ")||void 0;return Q`
3931
4050
  <div class="${Zt(e)}">
3932
4051
  ${this.label||this.helpText?Q`<div>
3933
- ${this.label?Q`<label for="sds-textarea" class="sds-textarea__label">${this.label}</label>`:tt}
4052
+ ${this.label?Q`<label for="sds-textarea" class="sds-textarea__label">${this.readOnly?Q`<sds-icon name="lock-material-filled" size="m"></sds-icon>`:tt}${this.label}</label>`:tt}
3934
4053
  ${this.helpText?Q`<p id="help-text" class="sds-textarea__help-text">${this.helpText}</p>`:tt}
3935
4054
  </div>`:tt}
3936
4055
  <div class="sds-textarea__input-container">
@@ -3960,4 +4079,4 @@ var t;const e=globalThis,s=e.ShadowRoot&&(void 0===e.ShadyCSS||e.ShadyCSS.native
3960
4079
  </div>
3961
4080
  ${this.errorMessage?Q`<sds-alert id="error-message" variant="secondary" data-palette="danger"><p slot="message">${this.errorMessage}</p></sds-alert>`:tt} ${this.renderCharacterCounter()}
3962
4081
  </div>
3963
- `}};fa.styles=[pa],ua([S({type:String})],fa.prototype,"value",2),ua([S({type:String,reflect:!0})],fa.prototype,"label",2),ua([S({type:String,reflect:!0})],fa.prototype,"placeholder",2),ua([S({type:String,attribute:"help-text",reflect:!0})],fa.prototype,"helpText",2),ua([S({type:String,attribute:"error-message",reflect:!0})],fa.prototype,"errorMessage",2),ua([S({type:String,reflect:!0})],fa.prototype,"autocomplete",2),ua([S({type:Boolean,reflect:!0})],fa.prototype,"required",2),ua([S({type:Number,reflect:!0})],fa.prototype,"rows",2),ua([S({type:Number,reflect:!0})],fa.prototype,"cols",2),ua([S({type:String,reflect:!0})],fa.prototype,"wrap",2),ua([S({type:Number,reflect:!0})],fa.prototype,"minlength",2),ua([S({type:Number,reflect:!0})],fa.prototype,"maxlength",2),ua([S({type:Number,reflect:!0})],fa.prototype,"counter",2),ua([S({type:String,reflect:!0})],fa.prototype,"size",2),ua([A("#sds-textarea")],fa.prototype,"control",2),fa=ua([L("sds-textarea")],fa);export{ye as SDSAlert,_e as SDSButton,Ce as SDSCard,Pe as SDSCheckbox,Ve as SDSCheckboxGroup,He as SDSChip,Ge as SDSDetails,Je as SDSDetailsGroup,le as SDSDialog,is as SDSHeading,Xt as SDSIcon,hs as SDSLoader,ms as SDSNotification,cr as SDSPopover,ks as SDSProcess,Es as SDSProcessStep,ur as SDSRadio,yr as SDSRadioGroup,Er as SDSSelect,Dr as SDSStepper,Vr as SDSStepperStep,Hr as SDSSwitch,Gr as SDSTag,ia as SDSText,fa as SDSTextArea,ha as SDSTextField,Jr as SDSTooltip};
4082
+ `}};fa.styles=[pa],ua([S({type:String})],fa.prototype,"value",2),ua([S({type:String,reflect:!0})],fa.prototype,"label",2),ua([S({type:String,reflect:!0})],fa.prototype,"placeholder",2),ua([S({type:String,attribute:"help-text",reflect:!0})],fa.prototype,"helpText",2),ua([S({type:String,attribute:"error-message",reflect:!0})],fa.prototype,"errorMessage",2),ua([S({type:String,reflect:!0})],fa.prototype,"autocomplete",2),ua([S({type:Boolean,reflect:!0})],fa.prototype,"required",2),ua([S({type:Number,reflect:!0})],fa.prototype,"rows",2),ua([S({type:Number,reflect:!0})],fa.prototype,"cols",2),ua([S({type:String,reflect:!0})],fa.prototype,"wrap",2),ua([S({type:Number,reflect:!0})],fa.prototype,"minlength",2),ua([S({type:Number,reflect:!0})],fa.prototype,"maxlength",2),ua([S({type:Number,reflect:!0})],fa.prototype,"counter",2),ua([S({type:String,reflect:!0})],fa.prototype,"size",2),ua([A("#sds-textarea")],fa.prototype,"control",2),fa=ua([L("sds-textarea")],fa);export{ve as SDSAlert,pe as SDSButton,xe as SDSCard,$e as SDSCheckbox,Le as SDSCheckboxGroup,Me as SDSChip,Fe as SDSDetails,We as SDSDetailsGroup,Je as SDSDialog,is as SDSHeading,Xt as SDSIcon,hs as SDSLoader,ms as SDSNotification,cr as SDSPopover,ks as SDSProcess,Es as SDSProcessStep,ur as SDSRadio,yr as SDSRadioGroup,Er as SDSSelect,Dr as SDSStepper,Vr as SDSStepperStep,Hr as SDSSwitch,Gr as SDSTag,ia as SDSText,fa as SDSTextArea,ha as SDSTextField,Jr as SDSTooltip};