@descope/web-components-ui 3.23.1 → 3.23.3

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.
@@ -9716,7 +9716,7 @@ class RawRecoveryCodes extends createBaseClass$1({
9716
9716
  this.attachShadow({ mode: 'open' }).innerHTML = `
9717
9717
  <div class="wrapper">
9718
9718
  <div class="codes-box">
9719
- <div class="list"></div>
9719
+ <div class="list"><div class="codes-list"></div></div>
9720
9720
  <descope-text class="icon-wrapper">
9721
9721
  <div class="icons">
9722
9722
  <vaadin-icon class="icon copy-icon" icon="vaadin:copy-o" title="Copy"></vaadin-icon>
@@ -9756,6 +9756,17 @@ class RawRecoveryCodes extends createBaseClass$1({
9756
9756
  display: flex;
9757
9757
  flex-grow: 1;
9758
9758
  flex-direction: column;
9759
+ /* text-align maps to align-items here, so it positions the codes block
9760
+ (start/center/end) inside the available space, not each row */
9761
+ }
9762
+ .codes-list {
9763
+ display: flex;
9764
+ flex-direction: column;
9765
+ /* rows always start-aligned so the bullets line up in any font.
9766
+ width:fit-content hugs the codes so .list can position the whole
9767
+ block (keep it, it also defeats the stretch fallback) */
9768
+ align-items: flex-start;
9769
+ width: fit-content;
9759
9770
  }
9760
9771
  descope-text span {
9761
9772
  display: inline-flex;
@@ -10099,7 +10110,7 @@ const RecoveryCodesClass = compose(
10099
10110
  createDynamicDataMixin$1({
10100
10111
  itemRenderer: itemRenderer$5,
10101
10112
  rerenderAttrsList: ['variant', 'mode'],
10102
- targetSelector: '.list',
10113
+ targetSelector: '.codes-list',
10103
10114
  }),
10104
10115
  draggableMixin$1,
10105
10116
  componentNameValidationMixin$1,
@@ -19709,7 +19720,7 @@ const customMixin$9 = (superclass) =>
19709
19720
  // Vaadin toggles visibility on Enter keydown but lets the event bubble,
19710
19721
  // and the SDK submits the form on any Enter that reaches the flow root.
19711
19722
  stopRevealButtonEnterPropagation() {
19712
- this.revealButton.addEventListener('keydown', (e) => {
19723
+ this.revealButton?.addEventListener('keydown', (e) => {
19713
19724
  if (e.key === 'Enter') e.stopPropagation();
19714
19725
  });
19715
19726
  }
@@ -19771,7 +19782,7 @@ const customMixin$9 = (superclass) =>
19771
19782
  handlePasswordVisibility(externalInput) {
19772
19783
  // disable vaadin's `__boundRevealButtonMouseDown` mouse-down event lisetener
19773
19784
  const origBoundRevealButtonMouseDown = this.baseElement.__boundRevealButtonMouseDown;
19774
- this.revealButton.removeEventListener('mousedown', origBoundRevealButtonMouseDown);
19785
+ this.revealButton?.removeEventListener('mousedown', origBoundRevealButtonMouseDown);
19775
19786
 
19776
19787
  // disable vaadin's `_passwordVisibleChanged` observer
19777
19788
  this.baseElement._passwordVisibleChanged = () => {};