dap-design-system 0.56.7 → 0.56.8

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.
@@ -187,8 +187,13 @@ export default class DapDSNavigationMenuItem extends DapDSNavigationMenuItem_bas
187
187
  * All others are removed (tabindex="-1") so Tab exits the whole nav in one step.
188
188
  */
189
189
  setRovingTabIndex(active: boolean): void;
190
- /** Apply tabindex to a trigger element and its shadow-root inner focusable element. */
190
+ /** Apply tabindex to a trigger element and its inner focusable element. */
191
191
  private _applyTriggerTabIndex;
192
+ /**
193
+ * Returns the inner light-DOM focusable element of a non-focusable wrapper
194
+ * trigger, or null when the trigger itself should be the tab stop.
195
+ */
196
+ private _getInnerLightDomFocusable;
192
197
  /** Focus the first focusable element in the dropdown (supports both nested nav items and mega menu content). */
193
198
  focusFirstDropdownChild(): void;
194
199
  /** Focus the last focusable element in the dropdown (supports both nested nav items and mega menu content). */
@@ -12807,7 +12807,8 @@ let Y = class extends pe {
12807
12807
  this.handleFileList(e != null ? e : null), this.setValidity(), this.emit("dds-files-accepted", { files: this._files });
12808
12808
  }
12809
12809
  render() {
12810
- var t, e;
12810
+ var i, o;
12811
+ const t = this.showBrowseButton === "true" && !this.autoupload, e = t || !(this.showDropzone && this.dropzoneFocusable === "true");
12811
12812
  return $`
12812
12813
  <div class="label-container">
12813
12814
  ${this.label && $`<dap-ds-form-label
@@ -12907,14 +12908,16 @@ let Y = class extends pe {
12907
12908
  ?disabled=${this.disabled}
12908
12909
  ?multiple=${this.multiple}
12909
12910
  ?required=${this.required}
12911
+ tabindex=${e ? "0" : "-1"}
12910
12912
  aria-labelledby="label"
12913
+ aria-hidden=${e ? "false" : "true"}
12911
12914
  aria-describedby="description ${this.feedback ? "feedback" : z}"
12912
12915
  @change=${this.onChange}
12913
12916
  @cancel=${this.onCancel}
12914
12917
  @invalid=${this.handleInvalid}
12915
12918
  @blur=${this.onBlur}
12916
12919
  @focus=${this.onFocus} />
12917
- ${this.showBrowseButton === "true" && !this.autoupload ? $` <dap-ds-button
12920
+ ${t ? $` <dap-ds-button
12918
12921
  class="input__button"
12919
12922
  part="browse-button"
12920
12923
  tabindex="-1"
@@ -12947,17 +12950,17 @@ let Y = class extends pe {
12947
12950
  </span>
12948
12951
  ${!this.fileList && this._uploadingFiles.size > 0 ? $`
12949
12952
  <div class="upload-progress" part="upload-progress">
12950
- ${Array.from(this._uploadingFiles).map((i) => {
12951
- const o = this._uploadProgress[i] || 0;
12953
+ ${Array.from(this._uploadingFiles).map((r) => {
12954
+ const a = this._uploadProgress[r] || 0;
12952
12955
  return $`
12953
12956
  <div class="upload-progress__item">
12954
12957
  <dap-ds-typography variant="caption">
12955
- ${i} - ${Math.round(o)}%
12958
+ ${r} - ${Math.round(a)}%
12956
12959
  </dap-ds-typography>
12957
12960
  <div class="upload-progress__bar">
12958
12961
  <div
12959
12962
  class="upload-progress__fill"
12960
- style="width: ${o}%"></div>
12963
+ style="width: ${a}%"></div>
12961
12964
  </div>
12962
12965
  </div>
12963
12966
  `;
@@ -12976,7 +12979,7 @@ let Y = class extends pe {
12976
12979
  <div>
12977
12980
  <dap-ds-typography variant="body">
12978
12981
  ${ot("fileInput.removeDialog.message", {
12979
- fileName: (e = (t = this._fileToRemove) == null ? void 0 : t.name) != null ? e : ""
12982
+ fileName: (o = (i = this._fileToRemove) == null ? void 0 : i.name) != null ? o : ""
12980
12983
  })}
12981
12984
  </dap-ds-typography>
12982
12985
  </div>
@@ -15833,8 +15836,18 @@ let at = class t extends mt(M) {
15833
15836
  ).some((o) => o.contains(e) || o.shadowRoot && o.shadowRoot.contains(e));
15834
15837
  }
15835
15838
  focus() {
15836
- const e = this._trigger;
15837
- e && e.length > 0 && e[0].focus();
15839
+ var i;
15840
+ const e = (i = this._trigger) == null ? void 0 : i[0];
15841
+ if (e) {
15842
+ if (!e.shadowRoot) {
15843
+ const o = this._getInnerLightDomFocusable(e);
15844
+ if (o) {
15845
+ o.focus();
15846
+ return;
15847
+ }
15848
+ }
15849
+ e.focus();
15850
+ }
15838
15851
  }
15839
15852
  /**
15840
15853
  * Sets this item as the active (or inactive) roving tabindex target.
@@ -15851,7 +15864,7 @@ let at = class t extends mt(M) {
15851
15864
  r && this._applyTriggerTabIndex(r, e);
15852
15865
  });
15853
15866
  }
15854
- /** Apply tabindex to a trigger element and its shadow-root inner focusable element. */
15867
+ /** Apply tabindex to a trigger element and its inner focusable element. */
15855
15868
  _applyTriggerTabIndex(e, i) {
15856
15869
  if (e.shadowRoot) {
15857
15870
  const o = e.shadowRoot.querySelector(
@@ -15861,9 +15874,22 @@ let at = class t extends mt(M) {
15861
15874
  e.removeAttribute("tabindex"), o.setAttribute("tabindex", i ? "0" : "-1");
15862
15875
  return;
15863
15876
  }
15877
+ } else {
15878
+ const o = this._getInnerLightDomFocusable(e);
15879
+ if (o) {
15880
+ e.removeAttribute("tabindex"), o.setAttribute("tabindex", i ? "0" : "-1");
15881
+ return;
15882
+ }
15864
15883
  }
15865
15884
  e.setAttribute("tabindex", i ? "0" : "-1");
15866
15885
  }
15886
+ /**
15887
+ * Returns the inner light-DOM focusable element of a non-focusable wrapper
15888
+ * trigger, or null when the trigger itself should be the tab stop.
15889
+ */
15890
+ _getInnerLightDomFocusable(e) {
15891
+ return ["A", "BUTTON", "INPUT", "SELECT", "TEXTAREA"].includes(e.tagName) ? null : e.querySelector("a[href], button:not([disabled])");
15892
+ }
15867
15893
  /** Focus the first focusable element in the dropdown (supports both nested nav items and mega menu content). */
15868
15894
  focusFirstDropdownChild() {
15869
15895
  const e = this.querySelector(
@@ -21529,17 +21555,17 @@ export {
21529
21555
  Na as Y,
21530
21556
  Ro as Z,
21531
21557
  ie as _,
21532
- Eo as a,
21558
+ Be as a,
21533
21559
  Ar as a0,
21534
21560
  zt as a1,
21535
21561
  Lr as a2,
21536
- Le as a3,
21537
- Ea as a4,
21562
+ Ea as a3,
21563
+ Le as a4,
21538
21564
  Pt as a5,
21539
21565
  ri as a6,
21540
21566
  Er as a7,
21541
21567
  no as a8,
21542
- Rt as a9,
21568
+ cn as a9,
21543
21569
  si as aA,
21544
21570
  ao as aB,
21545
21571
  Or as aC,
@@ -21549,11 +21575,11 @@ export {
21549
21575
  kr as aG,
21550
21576
  nr as aH,
21551
21577
  Zi as aI,
21552
- cn as aa,
21553
- ai as ab,
21554
- ki as ac,
21555
- Ri as ad,
21556
- lo as ae,
21578
+ Rt as aa,
21579
+ ki as ab,
21580
+ Ri as ac,
21581
+ lo as ad,
21582
+ ai as ae,
21557
21583
  Vi as af,
21558
21584
  Ue as ag,
21559
21585
  Ee as ah,
@@ -21575,24 +21601,24 @@ export {
21575
21601
  po as ax,
21576
21602
  me as ay,
21577
21603
  Pr as az,
21578
- Ut as b,
21579
- Be as c,
21580
- He as d,
21581
- to as e,
21582
- eo as f,
21604
+ to as b,
21605
+ eo as c,
21606
+ Ut as d,
21607
+ Eo as e,
21608
+ He as f,
21583
21609
  vi as g,
21584
21610
  ii as h,
21585
21611
  Ot as i,
21586
21612
  qt as j,
21587
21613
  Mt as k,
21588
21614
  Xt as l,
21589
- jt as m,
21590
- Ia as n,
21591
- $r as o,
21592
- Li as p,
21593
- Sr as q,
21594
- Po as r,
21595
- ve as s,
21615
+ Ia as m,
21616
+ $r as n,
21617
+ Li as o,
21618
+ Sr as p,
21619
+ Po as q,
21620
+ ve as r,
21621
+ jt as s,
21596
21622
  Ce as t,
21597
21623
  Ei as u,
21598
21624
  De as v,
@@ -21601,4 +21627,4 @@ export {
21601
21627
  Qt as y,
21602
21628
  wi as z
21603
21629
  };
21604
- //# sourceMappingURL=components-D_2wgf__.js.map
21630
+ //# sourceMappingURL=components-Dd2F_vzC.js.map