q2-tecton-elements 1.56.4 → 1.56.5

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 (162) hide show
  1. package/dist/bundle-report.json +184 -182
  2. package/dist/cjs/{index-905f4c87.js → index-ac3330d8.js} +33 -1
  3. package/dist/cjs/index-ac3330d8.js.map +1 -0
  4. package/dist/cjs/q2-action-group.cjs.entry.js +1 -1
  5. package/dist/cjs/q2-action-sheet.cjs.entry.js +1 -1
  6. package/dist/cjs/q2-badge_7.cjs.entry.js +1 -1
  7. package/dist/cjs/q2-calendar.cjs.entry.js +1 -1
  8. package/dist/cjs/q2-card.cjs.entry.js +1 -1
  9. package/dist/cjs/q2-carousel-pane.cjs.entry.js +1 -1
  10. package/dist/cjs/q2-carousel.cjs.entry.js +1 -1
  11. package/dist/cjs/q2-chart-area.cjs.entry.js +1 -1
  12. package/dist/cjs/q2-chart-bar.cjs.entry.js +1 -1
  13. package/dist/cjs/q2-chart-donut.cjs.entry.js +1 -1
  14. package/dist/cjs/q2-checkbox-group.cjs.entry.js +1 -1
  15. package/dist/cjs/q2-checkbox.cjs.entry.js +1 -1
  16. package/dist/cjs/q2-data-table.cjs.entry.js +1 -1
  17. package/dist/cjs/q2-detail.cjs.entry.js +1 -1
  18. package/dist/cjs/q2-dropdown-item.cjs.entry.js +1 -1
  19. package/dist/cjs/q2-dropdown.cjs.entry.js +4 -2
  20. package/dist/cjs/q2-dropdown.cjs.entry.js.map +1 -1
  21. package/dist/cjs/q2-editable-field.cjs.entry.js +1 -1
  22. package/dist/cjs/q2-file-picker.cjs.entry.js +1 -1
  23. package/dist/cjs/q2-item_3.cjs.entry.js +1 -1
  24. package/dist/cjs/q2-loc.cjs.entry.js +1 -1
  25. package/dist/cjs/q2-message.cjs.entry.js +1 -1
  26. package/dist/cjs/q2-modal.cjs.entry.js +1 -1
  27. package/dist/cjs/q2-month-picker.cjs.entry.js +1 -1
  28. package/dist/cjs/q2-optgroup.cjs.entry.js +1 -1
  29. package/dist/cjs/q2-option-list_2.cjs.entry.js +19 -14
  30. package/dist/cjs/q2-option-list_2.cjs.entry.js.map +1 -1
  31. package/dist/cjs/q2-option.cjs.entry.js +1 -1
  32. package/dist/cjs/q2-pagination.cjs.entry.js +1 -1
  33. package/dist/cjs/q2-pill.cjs.entry.js +1 -1
  34. package/dist/cjs/q2-radio-group.cjs.entry.js +1 -1
  35. package/dist/cjs/q2-radio.cjs.entry.js +1 -1
  36. package/dist/cjs/q2-relative-time.cjs.entry.js +1 -1
  37. package/dist/cjs/q2-section.cjs.entry.js +1 -1
  38. package/dist/cjs/q2-select.cjs.entry.js +43 -3
  39. package/dist/cjs/q2-select.cjs.entry.js.map +1 -1
  40. package/dist/cjs/q2-stepper-pane.cjs.entry.js +1 -1
  41. package/dist/cjs/q2-stepper-vertical.cjs.entry.js +1 -1
  42. package/dist/cjs/q2-stepper.cjs.entry.js +1 -1
  43. package/dist/cjs/q2-tag.cjs.entry.js +1 -1
  44. package/dist/cjs/q2-textarea.cjs.entry.js +1 -1
  45. package/dist/cjs/q2-tooltip.cjs.entry.js +1 -1
  46. package/dist/collection/components/q2-dropdown/q2-dropdown.js +3 -1
  47. package/dist/collection/components/q2-dropdown/q2-dropdown.js.map +1 -1
  48. package/dist/collection/components/q2-popover/q2-popover.js +19 -14
  49. package/dist/collection/components/q2-popover/q2-popover.js.map +1 -1
  50. package/dist/collection/components/q2-popover/test/q2-popover-test.spec.js +230 -147
  51. package/dist/collection/components/q2-popover/test/q2-popover-test.spec.js.map +1 -1
  52. package/dist/collection/components/q2-select/q2-select.js +42 -2
  53. package/dist/collection/components/q2-select/q2-select.js.map +1 -1
  54. package/dist/collection/components/q2-select/test/q2-select-test.spec.js +146 -6
  55. package/dist/collection/components/q2-select/test/q2-select-test.spec.js.map +1 -1
  56. package/dist/collection/utils/index.js +34 -0
  57. package/dist/collection/utils/index.js.map +1 -1
  58. package/dist/components/index2.js +32 -1
  59. package/dist/components/index2.js.map +1 -1
  60. package/dist/components/q2-dropdown.js +3 -1
  61. package/dist/components/q2-dropdown.js.map +1 -1
  62. package/dist/components/q2-popover2.js +19 -14
  63. package/dist/components/q2-popover2.js.map +1 -1
  64. package/dist/components/q2-select2.js +43 -3
  65. package/dist/components/q2-select2.js.map +1 -1
  66. package/dist/esm/{index-f2a66217.js → index-e4c2bfff.js} +33 -2
  67. package/dist/esm/index-e4c2bfff.js.map +1 -0
  68. package/dist/esm/q2-action-group.entry.js +1 -1
  69. package/dist/esm/q2-action-sheet.entry.js +1 -1
  70. package/dist/esm/q2-badge_7.entry.js +1 -1
  71. package/dist/esm/q2-calendar.entry.js +1 -1
  72. package/dist/esm/q2-card.entry.js +1 -1
  73. package/dist/esm/q2-carousel-pane.entry.js +1 -1
  74. package/dist/esm/q2-carousel.entry.js +1 -1
  75. package/dist/esm/q2-chart-area.entry.js +1 -1
  76. package/dist/esm/q2-chart-bar.entry.js +1 -1
  77. package/dist/esm/q2-chart-donut.entry.js +1 -1
  78. package/dist/esm/q2-checkbox-group.entry.js +1 -1
  79. package/dist/esm/q2-checkbox.entry.js +1 -1
  80. package/dist/esm/q2-data-table.entry.js +1 -1
  81. package/dist/esm/q2-detail.entry.js +1 -1
  82. package/dist/esm/q2-dropdown-item.entry.js +1 -1
  83. package/dist/esm/q2-dropdown.entry.js +4 -2
  84. package/dist/esm/q2-dropdown.entry.js.map +1 -1
  85. package/dist/esm/q2-editable-field.entry.js +1 -1
  86. package/dist/esm/q2-file-picker.entry.js +1 -1
  87. package/dist/esm/q2-item_3.entry.js +1 -1
  88. package/dist/esm/q2-loc.entry.js +1 -1
  89. package/dist/esm/q2-message.entry.js +1 -1
  90. package/dist/esm/q2-modal.entry.js +1 -1
  91. package/dist/esm/q2-month-picker.entry.js +1 -1
  92. package/dist/esm/q2-optgroup.entry.js +1 -1
  93. package/dist/esm/q2-option-list_2.entry.js +19 -14
  94. package/dist/esm/q2-option-list_2.entry.js.map +1 -1
  95. package/dist/esm/q2-option.entry.js +1 -1
  96. package/dist/esm/q2-pagination.entry.js +1 -1
  97. package/dist/esm/q2-pill.entry.js +1 -1
  98. package/dist/esm/q2-radio-group.entry.js +1 -1
  99. package/dist/esm/q2-radio.entry.js +1 -1
  100. package/dist/esm/q2-relative-time.entry.js +1 -1
  101. package/dist/esm/q2-section.entry.js +1 -1
  102. package/dist/esm/q2-select.entry.js +43 -3
  103. package/dist/esm/q2-select.entry.js.map +1 -1
  104. package/dist/esm/q2-stepper-pane.entry.js +1 -1
  105. package/dist/esm/q2-stepper-vertical.entry.js +1 -1
  106. package/dist/esm/q2-stepper.entry.js +1 -1
  107. package/dist/esm/q2-tag.entry.js +1 -1
  108. package/dist/esm/q2-textarea.entry.js +1 -1
  109. package/dist/esm/q2-tooltip.entry.js +1 -1
  110. package/dist/jest.setup.js +11 -0
  111. package/dist/jest.setup.js.map +1 -1
  112. package/dist/q2-tecton-elements/{index-f2a66217.js → index-e4c2bfff.js} +71 -46
  113. package/dist/q2-tecton-elements/index-e4c2bfff.js.map +1 -0
  114. package/dist/q2-tecton-elements/q2-action-group.entry.js +1 -1
  115. package/dist/q2-tecton-elements/q2-action-sheet.entry.js +1 -1
  116. package/dist/q2-tecton-elements/q2-badge_7.entry.js +1 -1
  117. package/dist/q2-tecton-elements/q2-calendar.entry.js +1 -1
  118. package/dist/q2-tecton-elements/q2-card.entry.js +1 -1
  119. package/dist/q2-tecton-elements/q2-carousel-pane.entry.js +1 -1
  120. package/dist/q2-tecton-elements/q2-carousel.entry.js +1 -1
  121. package/dist/q2-tecton-elements/q2-chart-area.entry.js +1 -1
  122. package/dist/q2-tecton-elements/q2-chart-bar.entry.js +1 -1
  123. package/dist/q2-tecton-elements/q2-chart-donut.entry.js +1 -1
  124. package/dist/q2-tecton-elements/q2-checkbox-group.entry.js +1 -1
  125. package/dist/q2-tecton-elements/q2-checkbox.entry.js +4 -4
  126. package/dist/q2-tecton-elements/q2-data-table.entry.js +1 -1
  127. package/dist/q2-tecton-elements/q2-detail.entry.js +1 -1
  128. package/dist/q2-tecton-elements/q2-dropdown-item.entry.js +1 -1
  129. package/dist/q2-tecton-elements/q2-dropdown.entry.js +8 -6
  130. package/dist/q2-tecton-elements/q2-dropdown.entry.js.map +1 -1
  131. package/dist/q2-tecton-elements/q2-editable-field.entry.js +1 -1
  132. package/dist/q2-tecton-elements/q2-file-picker.entry.js +1 -1
  133. package/dist/q2-tecton-elements/q2-item_3.entry.js +1 -1
  134. package/dist/q2-tecton-elements/q2-loc.entry.js +1 -1
  135. package/dist/q2-tecton-elements/q2-message.entry.js +1 -1
  136. package/dist/q2-tecton-elements/q2-modal.entry.js +1 -1
  137. package/dist/q2-tecton-elements/q2-month-picker.entry.js +1 -1
  138. package/dist/q2-tecton-elements/q2-optgroup.entry.js +1 -1
  139. package/dist/q2-tecton-elements/q2-option-list_2.entry.js +53 -48
  140. package/dist/q2-tecton-elements/q2-option-list_2.entry.js.map +1 -1
  141. package/dist/q2-tecton-elements/q2-option.entry.js +1 -1
  142. package/dist/q2-tecton-elements/q2-pagination.entry.js +1 -1
  143. package/dist/q2-tecton-elements/q2-pill.entry.js +1 -1
  144. package/dist/q2-tecton-elements/q2-radio-group.entry.js +1 -1
  145. package/dist/q2-tecton-elements/q2-radio.entry.js +13 -13
  146. package/dist/q2-tecton-elements/q2-relative-time.entry.js +4 -4
  147. package/dist/q2-tecton-elements/q2-section.entry.js +1 -1
  148. package/dist/q2-tecton-elements/q2-select.entry.js +44 -5
  149. package/dist/q2-tecton-elements/q2-select.entry.js.map +1 -1
  150. package/dist/q2-tecton-elements/q2-stepper-pane.entry.js +1 -1
  151. package/dist/q2-tecton-elements/q2-stepper-vertical.entry.js +1 -1
  152. package/dist/q2-tecton-elements/q2-stepper.entry.js +1 -1
  153. package/dist/q2-tecton-elements/q2-tag.entry.js +1 -1
  154. package/dist/q2-tecton-elements/q2-textarea.entry.js +1 -1
  155. package/dist/q2-tecton-elements/q2-tooltip.entry.js +1 -1
  156. package/dist/types/builds/q2e/development/tecton/tecton/packages/q2-tecton-elements/.stencil/jest.setup.d.ts +9 -0
  157. package/dist/types/components/q2-select/q2-select.d.ts +4 -0
  158. package/dist/types/utils/index.d.ts +2 -0
  159. package/package.json +3 -3
  160. package/dist/cjs/index-905f4c87.js.map +0 -1
  161. package/dist/esm/index-f2a66217.js.map +0 -1
  162. package/dist/q2-tecton-elements/index-f2a66217.js.map +0 -1
@@ -3,7 +3,7 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  const index = require('./index-e7e68b1e.js');
6
- const index$1 = require('./index-905f4c87.js');
6
+ const index$1 = require('./index-ac3330d8.js');
7
7
 
8
8
  const q2StepperVerticalCss = "*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}:host{display:grid;grid-template-columns:var(--tct-stepper-vertical-list-width, var(--tct-advanced-stepper-list-width, var(--t-advanced-stepper-list-width, 180px))) 1fr;gap:var(--tct-stepper-vertical-layout-gap, var(--tct-advanced-stepper-layout-gap, var(--t-advanced-stepper-layout-gap, 120px)))}.step-label,.step-child-label{color:var(--comp-btn-label-color);font-size:var(--comp-btn-label-font-size);font-weight:var(--comp-label-font-weight, 400);min-height:1.5em}.step-label{text-overflow:ellipsis;overflow:hidden;display:-webkit-box;-webkit-line-clamp:var(--tct-stepper-label-line-count, var(--tct-advanced-stepper-label-line-count, var(--t-advanced-stepper-label-line-count, 2)));-webkit-box-orient:vertical}[aria-selected=true] .step-label{font-weight:var(--tct-stepper-vertical-btn-active-font-weight, var(--tct-advanced-stepper-btn-active-font-weight, var(--t-advanced-stepper-btn-active-font-weight, 600)))}[aria-describedby] .step-label{text-overflow:ellipsis;overflow:hidden;display:-webkit-box;-webkit-line-clamp:var(--tct-stepper-label-line-count, var(--tct-advanced-stepper-label-line-count, var(--t-advanced-stepper-label-line-count, 1)));-webkit-box-orient:vertical}.step-child-label{grid-area:content;color:var(--comp-btn-label-color)}.step-description{color:var(--tct-stepper-vertical-description-color, var(--tct-advanced-stepper-description-color, var(--t-advanced-stepper-description-color, var(--t-textA, rgba(77, 77, 77, 0.77)))));font-size:var(--tct-stepper-vertical-description-font-size, var(--tct-advanced-stepper-description-font-size, var(--t-advanced-stepper-description-font-size, var(--app-font-size-small, 12px))));padding-bottom:0.2em}ul{--comp-top-btn-icon-size:var(--tct-stepper-vertical-btn-icon-size, var(--tct-advanced-stepper-btn-icon-size, var(--t-advanced-stepper-btn-icon-size, 24px)));--comp-btn-icon-size:var(--comp-top-btn-icon-size);--comp-btn-content-gap:var(--tct-stepper-vertical-btn-gap, var(--tct-advanced-stepper-btn-gap, var(--t-advanced-stepper-btn-gap, var(--app-scale-3x, 15px))));--comp-btn-label-font-size:var(--tct-stepper-vertical-btn-label-font-size, var(--tct-advanced-stepper-btn-label-font-size, var(--t-advanced-stepper-btn-label-font-size, 16px)));--comp-btn-label-color:var(--tct-stepper-vertical-label-color, var(--tct-advanced-stepper-label-color, var(--t-advanced-stepper-label-color, var(--t-text, #4d4d4d))));--comp-tween:var(--tct-stepper-vertical-tween, var(--tct-advanced-stepper-tween, var(--t-advanced-stepper-tween, var(--app-tween-1, 0.2s ease))));--comp-bullet-bg:var(--tct-stepper-vertical-bullet-active-background, var(--tct-advanced-stepper-bullet-active-bg, var(--t-advanced-stepper-bullet-active-bg, var(--t-primary, #0079c1))));list-style:none;margin:0;padding:0}ul ul{--comp-btn-icon-size:var(--tct-stepper-vertical-child-btn-icon-size, var(--tct-advanced-stepper-child-btn-icon-size, var(--t-advanced-stepper-child-btn-icon-size, 12px)));--comp-btn-content-gap:var(--tct-stepper-vertical-btn-gap, var(--tct-advanced-stepper-btn-gap, var(--t-advanced-stepper-btn-gap, var(--app-scale-2x, 10px))));--comp-btn-label-font-size:var(--tct-stepper-vertical-child-btn-label-font-size, var(--tct-advanced-stepper-child-btn-label-font-size, var(--t-advanced-stepper-child-btn-label-font-size, var(--app-font-size-small, 12px))))}ul ul[aria-hidden=true]{display:none}.step-btn,.step-child-btn{display:grid;grid-template-columns:var(--comp-btn-icon-size) 1fr;gap:var(--comp-btn-content-gap);text-align:var(--tct-stepper-vertical-btn-text-align, var(--tct-advanced-stepper-btn-text-align, var(--t-advanced-stepper-btn-text-align, start)));grid-template-areas:\"icon content\";align-items:center;width:100%;position:relative;background:transparent;border:0;cursor:pointer;padding:0;transition-property:box-shadow;outline:none}.step-btn[aria-disabled],.step-child-btn[aria-disabled]{cursor:default;--comp-label-font-weight:300;--comp-btn-label-color:var(--tct-stepper-vertical-btn-locked-color, var(--tct-advanced-stepper-btn-locked-color, var(--t-advanced-stepper-btn-locked-color, var(--t-textA, rgba(77, 77, 77, 0.77)))))}.step-btn[aria-selected=true],.step-child-btn[aria-selected=true]{--comp-label-font-weight:600}.step-btn{min-height:var(--tct-stepper-vertical-btn-height, var(--tct-advanced-stepper-btn-height, var(--t-advanced-stepper-btn-height, 40px)));font-size:var(--tct-stepper-vertical-btn-font-size, var(--tct-advanced-stepper-btn-font-size, var(--t-advanced-stepper-btn-font-size, 16px)));--comp-active-color:var(--comp-bullet-bg)}.step-btn.status-complete{--comp-active-color:var(--const-stoplight-success, #0e8a00);--tct-stoplight-success:var(--comp-active-color)}.step-btn.status-error{--comp-active-color:var(--const-stoplight-alert, #d20a0a);--tct-stoplight-warning:var(--comp-active-color)}.step-btn.status-locked{cursor:not-allowed}.step-child-btn{--comp-active-color:var(--comp-bullet-bg);min-height:var(--tct-stepper-vertical-child-btn-height, var(--tct-advanced-stepper-child-btn-height, var(--t-advanced-stepper-child-btn-height, 30px)));padding-left:var(--tct-stepper-vertical-child-btn-left-padding, var(--tct-advanced-stepper-child-btn-left-padding, var(--t-advanced-stepper-child-btn-left-padding, var(--app-scale-2x, 10px))));font-size:var(--tct-stepper-vertical-child-btn-font-size, var(--tct-advanced-stepper-child-btn-font-size, var(--t-advanced-stepper-child-btn-font-size, 12px)));border-left-width:var(--tct-stepper-vertical-child-btn-left-border-width, var(--tct-advanced-stepper-child-btn-left-border-width, var(--t-advanced-stepper-child-btn-left-border-width, 3px)));border-left-style:var(--tct-stepper-vertical-child-btn-left-border-style, var(--tct-advanced-stepper-child-btn-left-border-style, var(--t-advanced-stepper-child-btn-left-border-style, solid)));border-left-color:transparent}.step-child-btn[aria-selected=true]{--comp-btn-label-color:var(--comp-active-color);border-left-color:var(--comp-active-color)}.step-child-btn.status-error{--comp-btn-label-color:var(--const-stoplight-alert, #d20a0a);--comp-active-color:var(--const-stoplight-alert, #d20a0a)}.step-child-btn.status-locked{cursor:not-allowed}.step-content{grid-area:content}.step-icon,.step-bubble,.step-child-icon{grid-area:icon;width:var(--comp-btn-icon-size);height:var(--comp-btn-icon-size);line-height:0}.step-icon q2-icon,.step-bubble q2-icon,.step-child-icon q2-icon{width:var(--comp-btn-icon-size);height:var(--comp-btn-icon-size);--tct-stoplight-warning:var(--comp-active-color)}.step-icon,.step-bubble{background:var(--comp-active-color);color:var(--t-base, #ffffff);border-radius:50%}.status-complete .step-icon,.status-error .step-icon,.status-complete .step-bubble,.status-error .step-bubble{background:var(--comp-active-color)}.step-icon q2-icon:before,.step-bubble q2-icon:before{content:\"\";display:block;background:var(--t-base, #ffffff);position:absolute;width:80%;height:80%;left:11%;top:11%;border-radius:50%}.status-locked .step-icon,.status-locked .step-bubble{background:var(--t-gray-12, #d9d9d9);color:var(--t-text, #4d4d4d)}[aria-selected=true] .step-icon,[aria-selected=true] .step-bubble{box-shadow:0 0 0 2px var(--t-base, #ffffff), 0 0 0 4px var(--comp-active-color)}.step-bubble{display:flex;justify-content:center;align-items:center;line-height:0}.step-child-icon q2-icon{--tct-icon-stroke-primary:var(--comp-active-color);--tct-icon-stroke-secondary:var(--comp-active-color)}[aria-selected=true] .step-child-icon q2-icon{fill:var(--comp-active-color);--tct-icon-stroke-secondary:var(--t-base, #ffffff)}.spacer{height:0;border-left-width:var(--tct-stepper-vertical-child-border-width, var(--tct-advanced-stepaer-child-border-width, var(--t-advanced-stepaer-child-border-width, 1px)));border-left-style:var(--tct-stepper-vertical-child-border-style, var(--tct-advanced-stepper-child-border-style, var(--t-advanced-stepper-child-border-style, solid)));border-left-color:var(--tct-stepper-vertical-child-border-color, var(--tct-advanced-stepper-child-border-color, var(--t-advanced-stepper-child-border-color, var(--t-gray-12, #d9d9d9))));overflow:hidden;margin-left:calc(var(--comp-top-btn-icon-size) / 2);transition:height var(--comp-tween)}.spacer.has-sibling{height:var(--tct-stepper-vertical-spacer-height, var(--tct-advanced-stepper-spacer-height, var(--t-advanced-stepper-spacer-height, var(--app-scale-6x, 30px))))}.spacer ul{opacity:0;transition:opacity var(--comp-tween)}.spacer.is-opening ul,.spacer.is-open ul{display:block;opacity:1 !important}.spacer.is-open{overflow:visible}";
9
9
  const Q2StepperVerticalStyle0 = q2StepperVerticalCss;
@@ -3,7 +3,7 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  const index = require('./index-e7e68b1e.js');
6
- const index$1 = require('./index-905f4c87.js');
6
+ const index$1 = require('./index-ac3330d8.js');
7
7
 
8
8
  const q2StepperCss = "*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}:host{display:block;position:relative}ul{--comp-bullet-background:var(--tct-stepper-bullet-active-background, var(--tct-stepper-bullet-active-bg, var(--t-stepper-bullet-active-bg, var(--t-primary, #0079c1))));--comp-bullet-font-color:var(--tct-stepper-bullet-active-font-color, var(--t-stepper-bullet-active-font-color, var(--t-primary-font-color, #ffffff)));--comp-bullet-size:var(--tct-stepper-btn-icon-size, var(--t-stepper-btn-icon-size, 24px));--comp-bullet-gap:var(--tct-stepper-btn-gap, var(--t-stepper-btn-gap, var(--app-scale-3x, 15px)));--comp-bullet-font-size:var(--tct-stepper-btn-label-font-size, var(--t-stepper-btn-label-font-size, 16px));--comp-step-width:var(--tct-stepper-step-width, var(--t-stepper-step-width, var(--t-stepper-step-width, 80px)));--comp-step-gap:var(--tct-stepper-step-gap, var(--t-stepper-step-gap, 5px));--comp-btn-icon-size:var(--tct-stepper-btn-icon-size, var(--t-stepper-btn-icon-size, 24px));--comp-btn-label-font-size:var(--tct-stepper-btn-label-font-size, var(--t-stepper-btn-label-font-size, 16px));--comp-tween:var(--tct-stepper-tween, var(--t-stepper-tween, var(--app-tween-1, 0.2s ease)));overflow-x:auto;display:flex;justify-content:center;list-style:none;padding:0;padding:var(--tct-stepper-list-padding, var(--t-stepper-list-padding, 2px));margin:0;gap:var(--comp-step-gap);--comp-scrollbar-size:var(--tct-scrollbar-size, var(--t-scrollbar-size, var(--app-scale-1x, 5px)));--comp-scrollbar-border-radius:var(--tct-scrollbar-border-radius, var(--t-scrollbar-border-radius, var(--app-border-radius-1, 4px)));--comp-scrollbar-color:var(--tct-scrollbar-color, var(--t-scrollbar-color, var(--t-a11y-gray-color, #747474)));scrollbar-width:thin;scrollbar-color:var(--comp-scrollbar-color) transparent}ul::-webkit-scrollbar{width:var(--comp-scrollbar-size);height:var(--comp-scrollbar-size);margin:5px}ul::-webkit-scrollbar-thumb{background:var(--comp-scrollbar-color);border-radius:var(--comp-scrollbar-border-radius)}ul::-webkit-scrollbar-track{background:transparent;border-radius:var(--comp-scrollbar-border-radius)}.has-scroll ul{justify-content:unset}li{min-height:var(--tct-stepper-min-height, var(--t-stepper-min-height, 50px));flex:0 0 auto;position:relative;width:var(--comp-step-width);text-align:center;max-width:150px;min-width:80px}.step-btn{position:relative;background:transparent;border:0;cursor:pointer;display:flex;flex-direction:column;align-items:center;height:calc(100% - 4px);width:100%;transition:var(--comp-tween);padding:0;transition-property:box-shadow;outline:none;margin-top:2px;--comp-active-color:var(--comp-bullet-background)}.step-btn.status-complete{--comp-active-color:var(--const-stoplight-success, #0e8a00);--tct-stoplight-success:var(--comp-active-color)}.step-btn.status-error{--comp-active-color:var(--const-stoplight-alert, #d20a0a);--tct-stoplight-warning:var(--comp-active-color)}.step-btn[aria-disabled]{cursor:not-allowed}.step-btn[aria-disabled],.step-btn[aria-disabled]+.step-divider{--comp-bullet-font-color:var(--tct-stepper-bullet-inactive-font-color, var(--t-stepper-bullet-inactive-font-color, var(--t-text, #4d4d4d)));--comp-bullet-background:var(--tct-stepper-bullet-inactive-background, var(--tct-stepper-bullet-inactive-bg, var(--t-stepper-bullet-inactive-bg, var(--t-gray-12, #d9d9d9))))}.step-icon,.step-bubble{display:flex;justify-content:center;align-items:center;line-height:0;margin:var(--comp-bullet-gap) auto;color:var(--comp-bullet-font-color);width:var(--comp-btn-icon-size);height:var(--comp-btn-icon-size);min-height:var(--comp-btn-icon-size);font-size:var(--comp-bullet-font-size);transition:var(--comp-tween);transition-property:background, color;border-radius:50%;position:relative}.step-icon q2-icon,.step-bubble q2-icon{--tct-icon-fill:var(--comp-active-color)}.step-icon q2-icon:before,.step-bubble q2-icon:before{content:\"\";display:block;background:var(--comp-bullet-font-color);position:absolute;width:80%;height:80%;left:11%;top:11%;border-radius:50%}.status-complete .step-icon,.status-error .step-icon,.status-complete .step-bubble,.status-error .step-bubble{background:var(--comp-active-color)}[aria-selected] .step-icon,[aria-selected] .step-bubble{box-shadow:0 0 0 2px var(--t-base, #ffffff), 0 0 0 4px var(--comp-active-color);font-weight:var(--tct-stepper-bullet-active-font-weight, var(--t-stepper-bullet-active-font-weight, 600))}.step-bubble{background:var(--comp-bullet-background)}.step-divider{width:calc(var(--comp-step-width) - var(--comp-step-gap) - var(--comp-bullet-gap) - var(--comp-bullet-size));top:calc(var(--comp-bullet-size) / 2 + var(--comp-bullet-gap));left:calc(var(--comp-step-width) * -0.5 + var(--comp-step-gap) + var(--comp-bullet-gap));border:0;border-top:1px solid var(--comp-bullet-background);height:0;position:absolute;margin:0;transition:border var(--comp-tween)}.step-container{position:relative}.step-label{color:var(--tct-stepper-label-color, var(--tct-stepper-title-color, var(--t-stepper-title-color, var(--t-text, #4d4d4d))));font-size:var(--tct-stepper-label-font-size, var(--tct-stepper-title-font-size, var(--t-stepper-title-font-size, var(--app-font-size-small, 12px))));line-height:var(--tct-stepper-label-line-height, 1.5em);text-overflow:ellipsis;overflow:hidden;display:-webkit-box;-webkit-line-clamp:var(--tct-stepper-label-line-count, 2);-webkit-box-orient:vertical}[aria-selected] .step-label{font-weight:var(--tct-stepper-active-font-weight, var(--t-stepper-active-font-weight, 600))}[aria-describedby] .step-label{-webkit-line-clamp:var(--tct-stepper-label-line-count, 1)}.step-description{color:var(--tct-stepper-description-color, var(--t-stepper-description-color, var(--t-textA, rgba(77, 77, 77, 0.77))));font-size:var(--tct-stepper-description-font-size, var(--t-stepper-description-font-size, var(--app-font-size-small, 12px)));text-overflow:ellipsis;overflow:hidden;display:-webkit-box;-webkit-line-clamp:var(--tct-stepper-description-line-count, 4);-webkit-box-orient:vertical;padding-bottom:0.2em}.step-description .ellipsize{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:var(--comp-step-width);display:block}.gradient-left,.gradient-right{z-index:1;position:absolute;top:0;height:100%;width:18px}.gradient-left{background-image:linear-gradient(to left, var(--t-base-a0, rgba(255, 255, 255, 0)), var(--t-base-a2, rgba(255, 255, 255, 0.5)) 10%, var(--t-base, #ffffff) 100%);left:0}.gradient-right{background-image:linear-gradient(to right, var(--t-base-a0, rgba(255, 255, 255, 0)), var(--t-base-a2, rgba(255, 255, 255, 0.5)) 10%, var(--t-base, #ffffff) 100%);right:0}.btn-left,.btn-right{--tct-icon-size:18px;--tct-btn-icon-hover-background:transparent;--tct-btn-icon-width:22px;--tct-icon-stroke-primary:var(--tct-stepper-scroll-arrow-color, var(--t-stepper-scroll-arrow-color, var(--t-text, #4d4d4d)));position:absolute;top:calc(50% - 22px);z-index:2}.btn-left q2-icon,.btn-right q2-icon{--tct-icon-stroke-width:3}.btn-left{left:0}.btn-right{right:0}";
9
9
  const Q2StepperStyle0 = q2StepperCss;
@@ -3,7 +3,7 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  const index = require('./index-e7e68b1e.js');
6
- const index$1 = require('./index-905f4c87.js');
6
+ const index$1 = require('./index-ac3330d8.js');
7
7
  const actionSheet = require('./action-sheet-8254c0fd.js');
8
8
 
9
9
  const q2TagCss = "*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}:host{display:inline-block;position:relative;line-height:0}:host(:not(:last-child)){margin-inline-end:var(--tct-tag-margin, var(--t-tag-margin, var(--app-scale-2x, 10px)))}.tag-wrapper{--comp-tag-btn-size:var(--tct-tag-btn-size, var(--t-tag-btn-size, var(--app-scale-6x, 30px)));--comp-tag-background:var(--tct-tag-background, var(--t-tag-background, var(--t-gray-13, #e6e6e6)));--comp-tag-color:var(--tct-tag-color, var(--t-tag-color, var(--t-gray-3, #262626)));background:var(--comp-tag-background);color:var(--comp-tag-color);border-radius:var(--tct-tag-border-radius, var(--t-tag-border-radius, var(--app-border-radius-1, 4px)));position:relative}:host([theme=primary]) .tag-wrapper{--comp-tag-background:var(--tct-tag-primary-background, var(--t-primary, #0079c1));--comp-tag-color:var(--tct-tag-primary-font-color, var(--t-primary-text, #ffffff))}:host([theme=secondary]) .tag-wrapper{--comp-tag-background:var(--tct-tag-secondary-background, var(--t-secondary, #b3c2cc));--comp-tag-color:var(--tct-tag-secondary-font-color, var(--t-secondary-text, #141414))}:host([theme=tertiary]) .tag-wrapper{--comp-tag-background:var(--tct-tag-tertiary-background, var(--t-tertiary, #e8f5fc));--comp-tag-color:var(--tct-tag-tertiary-font-color, var(--t-tertiary-text, #141414))}.tag{display:flex;align-items:center;width:max-content;gap:6px;height:var(--tct-tag-height, var(--t-tag-height, var(--app-scale-6x, 30px)));line-height:var(--tct-tag-height, var(--t-tag-height, var(--app-scale-6x, 30px)));padding-inline:var(--tct-tag-padding-inline, var(--t-tag-padding-inline, var(--app-scale-3x, 15px)))}.tag ::slotted(q2-icon[slot=decorator]){--tct-icon-size:1em}.tag ::slotted(q2-badge[slot=decorator]){--tct-badge-height:1em;--tct-badge-line-height:30px}.tag.has-options{padding-right:6px}.btn-wrapper{--comp-tag-clickable-size:var(--tct-tag-clickable-size, var(--t-tag-clickable-size, 44px));--comp-tag-btn-offset:calc(calc(calc(var(--comp-tag-clickable-size) - var(--comp-tag-btn-size)) / 2) * -1);--comp-tag-background:var(--tct-tag-background, var(--t-tag-background, var(--t-gray-13, #e6e6e6)));height:var(--comp-tag-clickable-size);display:flex;align-items:center;justify-content:center;position:relative;right:var(--comp-tag-btn-offset);top:var(--comp-tag-btn-offset);cursor:pointer}button{height:var(--comp-tag-btn-size);stroke:var(--comp-tag-color);--tct-icon-stroke-primary:var(--comp-tag-color);cursor:pointer;border:0;background:transparent;display:flex;align-items:center;justify-content:center;padding:0;padding-right:6px;--tct-icon-size:18px}";
@@ -3,7 +3,7 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  const index = require('./index-e7e68b1e.js');
6
- const index$1 = require('./index-905f4c87.js');
6
+ const index$1 = require('./index-ac3330d8.js');
7
7
 
8
8
  const q2TextareaCss = "*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}:host{--comp-default-textarea-margin:var(--tct-textarea-margin-top, var(--t-textarea-margin-top, var(--app-scale-5x, 25px))) 0 var(--tct-textarea-margin-bottom, var(--t-textarea-margin-bottom, var(--app-scale-5x, 25px)));display:block;margin:var(--tct-textarea-margin, var(--comp-default-textarea-margin));font-size:var(--tct-textarea-font-size, var(--t-textarea-font-size, var(--app-font-size, inherit)))}:host([hidden]){display:none}label{--comp-label-padding:var(--tct-textarea-label-padding, 0 var(--tct-textarea-label-padding-right, var(--t-textarea-label-padding-right, 0)) 0 var(--tct-textarea-label-padding-left, var(--t-textarea-label-padding-left, 0)));--comp-label-margin:var(--tct-textarea-label-margin, var(--tct-textarea-label-margin-top, var(--t-textarea-label-margin-top, 0)) 0 var(--tct-textarea-label-margin-bottom, var(--t-textarea-label-margin-bottom, var(--tct-scale-1x, var(--app-scale-1x, 5px)))));display:block;padding:var(--comp-label-padding);margin:var(--comp-label-margin);color:var(--tct-textarea-label-font-color, var(--t-textarea-label-font-color, inherit));font-size:var(--tct-textarea-label-font-size, var(--t-textarea-label-font-size, inherit));font-weight:var(--tct-textarea-label-font-weight, var(--t-textarea-label-font-weight, 600));text-transform:var(--tct-textarea-label-text-transform, var(--t-textarea-label-text-transform, none));letter-spacing:var(--tct-textarea-label-letter-spacing, var(--t-textarea-label-letter-spacing, normal));transition:color var(--tct-textarea-tween, var(--t-textarea-tween, var(--tct-tween-2, var(--app-tween-2, 0.4s ease))))}.has-error label{color:var(--tct-textarea-error-label-font-color, var(--t-textarea-error-label-font-color, var(--tct-textarea-label-font-color, inherit)))}:hover label{color:var(--tct-textarea-hover-label-font-color, var(--tct-textarea-label-font-color, var(--t-textarea-label-font-color, inherit)))}.has-error :hover label{color:var(--tct-textarea-error-hover-label-font-color, var(--tct-textarea-error-label-font-color, var(--t-textarea-error-label-font-color, var(--tct-textarea-hover-label-font-color, var(--tct-textarea-label-font-color, inherit)))))}:host(:focus-within) label{color:var(--tct-textarea-focus-label-font-color, var(--tct-textarea-label-font-color, var(--t-textarea-label-font-color, inherit)))}:host(:focus-within) .has-error label{color:var(--tct-textarea-error-focus-label-font-color, var(--tct-textarea-error-label-font-color, var(--t-textarea-error-label-font-color, var(--tct-textarea-focus-label-font-color, var(--tct-textarea-label-font-color, var(--t-textarea-label-font-color, inherit))))))}.optional-tag{--comp-label-optional-margin:var(--tct-textarea-label-optional-margin, 0 0 0 var(--tct-textarea-label-optional-margin-left, var(--t-textarea-label-optional-margin-left, var(--tct-scale-1x, var(--app-scale-1x, 5px)))));margin:var(--comp-label-optional-margin);color:var(--tct-textarea-label-optional-font-color, var(--t-textarea-label-optional-font-color, var(--t-textA, var(--t-a11y-gray-color, rgba(77, 77, 77, 0.77)))));font-size:var(--tct-textarea-label-optional-font-size, var(--t-textarea-label-optional-font-size, 12px));font-weight:var(--tct-textarea-label-optional-font-weight, var(--t-textarea-label-optional-font-weight, 400))}.input-container{min-height:var(--tct-textarea-min-height, var(--t-textarea-min-height, var(--comp-textarea-min-height)));height:100%;--comp-default-border-radius:var(--tct-border-radius-1, var(--app-border-radius-1, 4px));--comp-textarea-border-top-left-radius:var(--tct-textarea-border-top-left-radius, var(--t-textarea-border-top-left-radius, var(--comp-default-border-radius)));--comp-textarea-border-top-right-radius:var(--tct-textarea-border-top-right-radius, var(--t-textarea-border-top-right-radius, var(--comp-default-border-radius)));--comp-textarea-border-bottom-right-radius:var(--tct-textarea-border-bottom-right-radius, var(--t-textarea-border-bottom-right-radius, var(--comp-default-border-radius)));--comp-textarea-border-bottom-left-radius:var(--tct-textarea-border-bottom-left-radius, var(--t-textarea-border-bottom-left-radius, var(--comp-default-border-radius)));--comp-textarea-border-radius:var(--comp-textarea-border-top-left-radius)\n var(--comp-textarea-border-top-right-radius) var(--comp-textarea-border-bottom-right-radius)\n var(--comp-textarea-border-bottom-left-radius);--comp-textarea-border-width:var(--tct-textarea-border-top-width, var(--t-textarea-border-top-width, 1px)) var(--tct-textarea-border-right-width, var(--t-textarea-border-right-width, 1px)) var(--tct-textarea-border-bottom-width, var(--t-textarea-border-bottom-width, 1px)) var(--tct-textarea-border-left-width, var(--t-textarea-border-left-width, 1px));--comp-textarea-icon-clearance:34px}:host([disabled]) .input-container{cursor:not-allowed;opacity:var(--tct-textarea-disabled-opacity, var(--t-textarea-disabled-opacity, var(--tct-disabled-opacity, var(--app-disabled-opacity, 0.4))))}.content-container{--comp-textarea-min-height:46px;--comp-textarea-min-width:150px;position:relative;display:inline-block;min-height:var(--tct-textarea-min-height, var(--t-textarea-min-height, var(--comp-textarea-min-height)));min-width:var(--tct-textarea-min-width, var(--t-textarea-min-width, var(--comp-textarea-min-width)))}:host(:not([cols])) .content-container{width:100%}textarea{--comp-textarea-padding:var(--tct-textarea-padding, var(--tct-textarea-vertical-padding, var(--t-textarea-vertical-padding, var(--tct-scale-2x, var(--app-scale-2x, 10px)))) var(--tct-textarea-horizontal-padding, var(--t-textarea-horizontal-padding, var(--tct-scale-2x, var(--app-scale-2x, 10px)))));--comp-textarea-border-color:var(--tct-textarea-border-color, var(--t-textarea-border-color, var(--tct-input-border-color, var(--t-input-border-color, var(--t-a11y-gray-color-AA, #949494)))));--comp-textarea-background:var(--tct-textarea-background, var(--tct-textarea-bg, var(--t-textarea-bg, var(--tct-input-background, var(--tct-input-bg, var(--t-input-bg, var(--t-gray-14, #fcfcfd)))))));--comp-textarea-hover-ring-color:var(--tct-textarea-hover-ring-color);--comp-textarea-hover-ring:0 0 0 2px var(--t-base), 0 0 0 4px var(--comp-textarea-hover-ring-color), var(--tct-textarea-hover-box-shadow, 0 0 transparent);resize:none;height:100%;-webkit-appearance:none;appearance:none;display:block;box-sizing:border-box;min-height:var(--tct-textarea-min-height, var(--t-textarea-min-height, var(--comp-textarea-min-height)));padding:var(--comp-textarea-padding);background:var(--comp-textarea-background);color:var(--tct-textarea-font-color, var(--t-textarea-font-color, var(--t-input-font-color, inherit)));border-width:var(--comp-textarea-border-width);border-style:solid;border-color:var(--comp-textarea-border-color);border-radius:var(--comp-textarea-border-radius);box-shadow:var(--tct-textarea-box-shadow, var(--t-textarea-box-shadow, none));scrollbar-width:thin;scrollbar-color:var(--t-a11y-gray-color) transparent;--comp-textarea-tween:var(--tct-textarea-tween, var(--t-textarea-tween, var(--tct-tween-2, var(--app-tween-2, 0.4s ease))));transition:border-width var(--comp-textarea-tween), border-color var(--comp-textarea-tween), box-shadow var(--comp-textarea-tween)}textarea::-webkit-scrollbar{width:var(--app-scale-1x);height:var(--app-scale-1x);margin:var(--app-scale-1x)}textarea::-webkit-scrollbar-thumb{background:var(--t-a11y-gray-color);border-radius:2px}textarea::-webkit-scrollbar-track{background:transparent}textarea:not([cols]){width:100%}.has-error textarea{padding-right:var(--comp-textarea-icon-clearance);border-color:var(--tct-textarea-error-border-color, var(--t-textarea-error-border-color, var(--const-stoplight-alert, #d20a0a)));background:var(--tct-textarea-error-background, var(--comp-textarea-background))}textarea:hover{border-color:var(--tct-textarea-hover-border-color, var(--comp-textarea-border-color));background:var(--tct-textarea-hover-background, var(--comp-textarea-background));box-shadow:var(--tct-textarea-hover-box-shadow, var(--comp-textarea-hover-ring))}.has-error textarea:hover{border-color:var(--tct-textarea-error-hover-border-color, var(--tct-textarea-error-border-color, var(--t-textarea-error-border-color, var(--const-stoplight-alert, #d20a0a))));background:var(--tct-textarea-error-hover-background, var(--tct-textarea-error-background, var(--comp-textarea-background)));box-shadow:var(--tct-textarea-error-hover-box-shadow, var(--tct-textarea-error-box-shadow, var(--tct-textarea-hover-box-shadow, var(--comp-textarea-hover-ring))))}textarea:focus{border-color:var(--tct-textarea-focus-border-color, var(--comp-textarea-border-color));background:var(--tct-textarea-focus-background, var(--comp-textarea-background));box-shadow:var(--tct-textarea-focus-box-shadow, var(--const-double-focus-ring))}.has-error textarea:focus{border-color:var(--tct-textarea-error-focus-border-color, var(--tct-textarea-error-border-color, var(--const-stoplight-alert, #d20a0a)));background:var(--tct-textarea-error-focus-background, var(--tct-textarea-error-background, var(--tct-textarea-focus-background, var(--comp-textarea-background))));box-shadow:var(--tct-textarea-error-focus-box-shadow, var(--tct-textarea-error-box-shadow, var(--tct-textarea-focus-box-shadow, var(--const-double-focus-ring))))}textarea::placeholder{color:var(--tct-textarea-placeholder-font-color, var(--t-textarea-placeholder-font-color, var(--t-input-placeholder-font-color, var(--tct-gray-7, var(--app-gray-7, var(--tct-gray-d1, var(--app-gray-d1, #666666)))))))}textarea[disabled]{cursor:not-allowed}textarea.resize-vertical-auto{overflow:hidden}.has-error textarea{padding-right:var(--comp-textarea-icon-clearance)}.has-error textarea:not(:focus){border-color:var(--tct-textarea-error-border-color, var(--t-textarea-error-border-color, var(--const-stoplight-alert, #d20a0a)))}q2-icon{margin-top:calc(var(--tct-textarea-border-top-width, var(--t-textarea-border-top-width, 1px)) / 2);margin-bottom:calc(var(--tct-textarea-border-bottom-width, var(--t-textarea-border-bottom-width, 1px)) / 2);pointer-events:none;position:absolute;top:var(--tct-textarea-vertical-padding, var(--t-textarea-vertical-padding, var(--tct-scale-2x, var(--app-scale-2x, 10px))));color:var(--tct-textarea-icon-stroke-primary, var(--t-textarea-icon-stroke-primary, var(--app-gray-9, var(--tct-gray, var(--app-gray, #999999)))));right:0;margin-right:var(--tct-scale-2x, var(--app-scale-2x, 10px));--tct-icon-stroke-primary:var(--tct-textarea-icon-stroke-primary, var(--t-textarea-icon-stroke-primary, var(--tct-gray-9, var(--t-gray-9, var(--tct-gray, var(--app-gray, #999999))))));--t-icon-stroke-primary:var(--tct-textarea-icon-stroke-primary, var(--t-textarea-icon-stroke-primary, var(--tct-gray-9, var(--t-gray-9, var(--tct-gray, var(--app-gray, #999999))))))}.icon-error{color:var(--tct-stoplight-error, var(--const-stoplight-alert, #d20a0a));--tct-icon-stroke-primary:var(--tct-stoplight-error, var(--const-stoplight-alert, #d20a0a));--t-icon-stroke-primary:var(--tct-stoplight-error, var(--const-stoplight-alert, #d20a0a))}.messages-container{height:0px;overflow:hidden;background:var(--tct-message-background, var(--tct-message-bg, var(--tct-gray-14, var(--t-gray-14, var(--tct-gray-l3, var(--app-gray-l3, #f2f2f2))))));box-shadow:var(--tct-textarea-message-box-shadow, var(--t-textarea-message-box-shadow, var(--tct-box-shadow-1, var(--app-shadow-1, 0px 0px 2px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14)))));transition:height var(--tct-textarea-messages-tween, var(--t-textarea-messages-tween, var(--tct-tween-1, var(--app-tween-1, 0.2s ease))));margin-top:2px;z-index:1;position:absolute;width:100%;color:var(--tct-textarea-messages-font-color, var(--t-textarea-messages-font-color, inherit))}.max-length{color:var(--tct-textarea-max-length-color, var(--t-textarea-max-length-color, var(--t-textA, rgba(77, 77, 77, 0.77))));font-size:var(--tct-textarea-max-length-font-size, var(--t-textarea-max-length-font-size, var(--tct-font-size-small, var(--app-font-size-small, 12px))));position:absolute;right:0}.btn-resize{--tct-textarea-resize-icon-padding:calc(\n calc(\n var(--tct-textarea-resize-btn-width, var(--t-textarea-resize-btn-width, var(--tct-btn-icon-width, 44px))) - var(--tct-textarea-resize-icon-size, var(--t-textarea-resize-icon-size, 12px))\n ) / 2\n );width:var(--tct-textarea-resize-btn-width, var(--t-textarea-resize-btn-width, var(--tct-btn-icon-width, 44px)));height:var(--tct-textarea-resize-btn-height, var(--t-textarea-resize-btn-height, var(--tct-btn-icon-height, 44px)));background:var(--tct-textarea-resize-btn-background, var(--t-textarea-resize-btn-background, transparent));stroke:var(--tct-textarea-resize-color, var(--t-textarea-resize-color, var(--t-textA, rgba(77, 77, 77, 0.77))));border:0;position:absolute;right:calc(var(--tct-textarea-resize-icon-padding, var(--t-textarea-resize-icon-padding)) * -1 + 2px);bottom:calc(var(--tct-textarea-resize-icon-padding, var(--t-textarea-resize-icon-padding)) * -1 + 2px);display:block;padding:var(--tct-textarea-resize-icon-padding, var(--t-textarea-resize-icon-padding));font-size:0}.btn-resize:focus{outline:none;box-shadow:none}:host([resize=both]) .btn-resize{cursor:se-resize}:host([resize=vertical]) .btn-resize,:host([resize=vertical-auto]) .btn-resize{cursor:s-resize}:host([resize=horizontal]) .btn-resize{cursor:e-resize}";
9
9
  const Q2TextareaStyle0 = q2TextareaCss;
@@ -3,7 +3,7 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  const index = require('./index-e7e68b1e.js');
6
- const index$1 = require('./index-905f4c87.js');
6
+ const index$1 = require('./index-ac3330d8.js');
7
7
 
8
8
  const q2TooltipCss = "*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}:host{display:inline-block}:host([block]){display:block}.tooltip{--comp-background:var(--tct-tooltip-background, var(--tct-tooltip-background-color, var(--t-tooltip-background-color, var(--t-top-a3, rgba(13, 13, 13, 0.8509803922)))));--comp-offset-default:calc(var(--app-scale-1x, 5px) * -1);--comp-offset:var(--tct-tooltip-offset, var(--t-tooltip-offset, var(--comp-offset-default)));--comp-position:var(--tct-tooltip-position, var(--t-tooltip-position, var(--app-scale-1x, 5px)));--comp-body-offset-default:calc(var(--app-scale-3x, 15px) * -1);--comp-body-offset:var(--tct-tooltip-body-offset, var(--t-tooltip-body-offset, var(--comp-body-offset-default)));--comp-duration:var(--tct-tooltip-transition-duration, var(--t-tooltip-transition-duration, var(--app-duration-1, 0.2s)));--comp-visible-duration:var(--tct-tooltip-transition-visible-duration, var(--t-tooltip-transition-visible-duration, 2s));--comp-delay:var(--tct-tooltip-transition-delay, var(--t-tooltip-transition-delay, 0s));display:inline-block;position:relative}.tooltip:hover{--comp-delay:var(--tct-tooltip-transition-delay, var(--t-tooltip-transition-delay, 1s))}:host([immediate]:not([immediate=false])) .tooltip:hover{--comp-delay:0s}.tooltip:before{position:absolute;z-index:2;width:0;height:0;color:var(--comp-background);pointer-events:none;content:\"\";border:var(--tct-tooltip-arrow-size, var(--t-tooltip-arrow-size, var(--app-scale-1x, 5px))) solid transparent}.tooltip:after{--comp-padding:var(--app-scale-1x, 5px) 8px;position:absolute;z-index:1;padding:var(--tct-tooltip-padding, var(--t-tooltip-padding, var(--comp-padding)));font-weight:var(--tct-tooltip-font-weight, var(--t-tooltip-font-weight, 600));font-size:var(--tct-tooltip-font-size, var(--t-tooltip-font-size, var(--app-font-size-small, 12px)));line-height:1.5;color:var(--tct-tooltip-color, var(--t-tooltip-color, var(--app-white, #ffffff)));text-align:center;text-decoration:none;text-shadow:none;text-transform:none;word-wrap:break-word;white-space:pre;pointer-events:none;content:attr(aria-label);background:var(--comp-background);border-radius:var(--tct-tooltip-border-radius, var(--t-tooltip-border-radius, var(--app-border-radius-1, 4px)))}.tooltip:before,.tooltip:after{display:inline-block;visibility:hidden;opacity:0;transition:all var(--comp-duration) ease-in-out var(--comp-delay)}:host([block]) .tooltip{display:block}.tooltip:hover:before,.tooltip:hover:after,.tooltip.has-keyboard-focus:focus-within:before,.tooltip.has-keyboard-focus:focus-within:after,:host([persistent]:not([persistent=false])) .tooltip:before,:host([persistent]:not([persistent=false])) .tooltip:after{text-decoration:none;visibility:visible;opacity:1}@keyframes tooltippedFade{from{opacity:0}to{opacity:1}}.tooltip.has-generic-focus:focus-within:before,.tooltip.has-generic-focus:focus-within:after{visibility:visible;opacity:0;transition:none;animation-timing-function:ease-in-out;animation-fill-mode:forwards;animation-name:tooltippedFade, tooltippedFade;animation-direction:normal, reverse;animation-duration:var(--comp-duration);animation-delay:0ms, calc(var(--comp-visible-duration) + var(--comp-duration))}.tooltip.has-generic-focus-out:before,.tooltip.has-generic-focus-out:after{visibility:visible;opacity:0;transition:none;animation-timing-function:ease-in-out;animation-fill-mode:forwards;animation-name:tooltippedFade;animation-direction:reverse;animation-duration:var(--comp-duration)}:host([multiline]) .tooltip:after{width:max-content;max-width:var(--tct-tooltip-max-width, var(--t-tooltip-max-width, 200px));word-break:break-word;word-wrap:normal;white-space:pre-line;border-collapse:separate;text-align:left}:host([position=s]) :host([multiline]) .tooltip:after,:host([position=n]) :host([multiline]) .tooltip:after{right:auto;left:50%;transform:translateX(-50%)}:host([position=w]) :host([multiline]) .tooltip:after,:host([position=e]) :host([multiline]) .tooltip:after{right:100%}:host([multiline]) .tooltip:hover:after,:host([multiline]) .tooltip:active:after,:host([multiline]) .tooltip:focus:after{display:table-cell}:host([multiline]) .tooltip:focus-within:after{display:table-cell}:host([position=s]) .tooltip:after,:host([position=se]) .tooltip:after,:host([position=sw]) .tooltip:after{top:100%;right:50%;margin-top:var(--comp-position)}:host([position=s]) .tooltip:before,:host([position=se]) .tooltip:before,:host([position=sw]) .tooltip:before{top:auto;right:50%;bottom:var(--comp-offset);margin-right:var(--comp-offset);border-bottom-color:var(--comp-background)}:host([position=n]) .tooltip:after,:host([position=ne]) .tooltip:after,:host([position=nw]) .tooltip:after{right:50%;bottom:100%;margin-bottom:var(--comp-position)}:host([position=n]) .tooltip:before,:host([position=ne]) .tooltip:before,:host([position=nw]) .tooltip:before{top:var(--comp-offset);right:50%;bottom:auto;margin-right:var(--comp-offset);border-top-color:var(--comp-background)}:host([position=se]) .tooltip:after,:host([position=ne]) .tooltip:after{right:auto;left:50%;margin-left:var(--comp-body-offset)}:host([position=sw]) .tooltip:after{margin-right:var(--comp-body-offset)}:host([position=nw]) .tooltip:after{margin-right:var(--comp-body-offset)}:host([position=s]) .tooltip:after,:host([position=n]) .tooltip:after{transform:translateX(50%)}:host([position=w]) .tooltip:after{right:100%;bottom:50%;margin-right:var(--comp-position);transform:translateY(50%)}:host([position=w]) .tooltip:before{top:50%;bottom:50%;left:var(--comp-offset);margin-top:var(--comp-offset);border-left-color:var(--comp-background)}:host([position=e]) .tooltip:after{bottom:50%;left:100%;margin-left:var(--comp-position);transform:translateY(50%)}:host([position=e]) .tooltip:before{top:50%;right:var(--comp-offset);bottom:50%;margin-top:var(--comp-offset);border-right-color:var(--comp-background)}";
9
9
  const Q2TooltipStyle0 = q2TooltipCss;
@@ -39,6 +39,7 @@ export class Q2Dropdown {
39
39
  };
40
40
  this.onToggleClick = async (event) => {
41
41
  event.stopPropagation();
42
+ this.popoverElement.controlElement = this.controlElement;
42
43
  if (shouldShowActionSheet(this)) {
43
44
  this._handleActionSheet(event);
44
45
  }
@@ -51,6 +52,7 @@ export class Q2Dropdown {
51
52
  if (isTabMetaOrCtrl)
52
53
  return;
53
54
  event.preventDefault();
55
+ this.popoverElement.controlElement = this.controlElement;
54
56
  if (shouldShowActionSheet(this, event)) {
55
57
  this._handleActionSheet(event);
56
58
  }
@@ -317,7 +319,7 @@ export class Q2Dropdown {
317
319
  // #region Render Methods
318
320
  render() {
319
321
  const btnProps = this.toggleButtonProps;
320
- return (h("click-elsewhere", { key: 'bf4d4da663e9225d757a8411a983073112a53caf', class: this.open ? 'dropdown-open' : '', onChange: this.onClickElsewhere, "test-id": "dropdownContainer" }, h("q2-btn", { key: 'f67bd9f9d0eb7607c95ce39cbcd1c54273948b9c', ref: el => (this.controlElement = el), class: btnProps.className, onClick: this.onToggleClick, onKeyDown: this.onToggleKeydown, fab: btnProps.fab, intent: btnProps.intent, onFocusout: this.handleFocusOut, active: btnProps.active, disabled: btnProps.disabled, ariaExpanded: `${!!btnProps.ariaExpanded}`, label: this.hideLabel && this.label ? loc(this.label) : undefined, hideLabel: this.hideLabel, ariaHasPopup: "menu", "test-id": "dropdownButton", block: this.block, description: loc('tecton.element.dropdown.itemCount', [this.determineDropdownItemCount]) }, this.hasCustomControl ? (h("div", { "test-id": "dropdownControl", class: btnProps.custom ? '' : 'hidden' }, h("slot", { name: "control" }))) : (h(Fragment, null, this.icon ? h("q2-icon", { type: this.icon }) : ' ', this.label && !this.hideLabel && (h("span", { class: "dropdown-button-text" }, loc(this.label)))))), h("q2-popover", { key: '48d3ae90a89d08277a02cbf3588ffc1b33113dba', ref: el => (this.popoverElement = el), controlElement: this.controlElement, open: this.open, "max-height": this.popoverMaxHeight, onFocusout: this.handleFocusOut, minHeight: this.popoverMinHeight, direction: this.popoverDirection, align: this.popoverAlignment, mode: this.popoverMode || undefined, block: this.block }, h("q2-option-list", { key: '23f0f0000eaf3bb5a1b3b738c03844f06ffb72c2', onPopoverState: this.onPopoverState, id: "option-list", ref: el => (this.optionList = el), type: "menu", label: loc('tecton.element.optionList.label', [this.optionListLabel]), "no-select": true }, h("slot", { key: '193e517ed0d5bd2893b0931c3782a4920ddcdc5a' })))));
322
+ return (h("click-elsewhere", { key: '2dbfbb36ffbb6d7a11469904c0162c6663ecc187', class: this.open ? 'dropdown-open' : '', onChange: this.onClickElsewhere, "test-id": "dropdownContainer" }, h("q2-btn", { key: '518bb9c02c4a5287a4d3aea5c46a2beba7999d47', ref: el => (this.controlElement = el), class: btnProps.className, onClick: this.onToggleClick, onKeyDown: this.onToggleKeydown, fab: btnProps.fab, intent: btnProps.intent, onFocusout: this.handleFocusOut, active: btnProps.active, disabled: btnProps.disabled, ariaExpanded: `${!!btnProps.ariaExpanded}`, label: this.hideLabel && this.label ? loc(this.label) : undefined, hideLabel: this.hideLabel, ariaHasPopup: "menu", "test-id": "dropdownButton", block: this.block, description: loc('tecton.element.dropdown.itemCount', [this.determineDropdownItemCount]) }, this.hasCustomControl ? (h("div", { "test-id": "dropdownControl", class: btnProps.custom ? '' : 'hidden' }, h("slot", { name: "control" }))) : (h(Fragment, null, this.icon ? h("q2-icon", { type: this.icon }) : ' ', this.label && !this.hideLabel && (h("span", { class: "dropdown-button-text" }, loc(this.label)))))), h("q2-popover", { key: '85dd9bff87abbaed84806307a9675e6013c7a14a', ref: el => (this.popoverElement = el), controlElement: this.controlElement, open: this.open, "max-height": this.popoverMaxHeight, onFocusout: this.handleFocusOut, minHeight: this.popoverMinHeight, direction: this.popoverDirection, align: this.popoverAlignment, mode: this.popoverMode || undefined, block: this.block }, h("q2-option-list", { key: 'ab2e65a199faf78e1d97b82aa095d06046883d1e', onPopoverState: this.onPopoverState, id: "option-list", ref: el => (this.optionList = el), type: "menu", label: loc('tecton.element.optionList.label', [this.optionListLabel]), "no-select": true }, h("slot", { key: '1bccbc21444696f1c045c82fe4713b930f3cef71' })))));
321
323
  }
322
324
  static get is() { return "q2-dropdown"; }
323
325
  static get encapsulation() { return "shadow"; }
@@ -1 +1 @@
1
- {"version":3,"file":"q2-dropdown.js","sourceRoot":"","sources":["../../../../src/components/q2-dropdown/q2-dropdown.tsx"],"names":[],"mappings":"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","sourcesContent":["import { shouldShowActionSheet, showActionSheetList } from '@/utils/action-sheet';\nimport { Component, ComponentInterface, Prop, Method, Element, Watch, h, Fragment, Listen } from '@stencil/core';\nimport {\n handleAriaLabel,\n handleRenamedProp,\n isEventFromElement,\n loc,\n overrideFocus,\n waitForNextPaint,\n} from 'src/utils';\n\n/** @slot control - An optional slot to provide custom content as the clickable interface. The Dropdown **must** have `type=\"custom\"` to use the control slot. */\n@Component({ tag: 'q2-dropdown', shadow: true, styleUrl: 'q2-dropdown.scss' })\nexport class Q2Dropdown implements ComponentInterface {\n // #region Own Properties\n\n controlElement?: HTMLQ2BtnElement;\n dropdownItemSelector: string = 'q2-dropdown-item:not([disabled]):not([separator])';\n optionSelector: string = 'q2-option:not([disabled]):not([separator])';\n optionList: HTMLQ2OptionListElement;\n popoverElement?: HTMLQ2PopoverElement;\n\n // #endregion\n // #region Host HTML Element\n\n @Element()\n hostElement: HTMLElement;\n\n // #endregion\n // #region Public Property API\n\n @Prop({ reflect: true })\n additionalContext: string;\n\n /** @deprecated */\n @Prop({ reflect: true })\n alignment: 'left' | 'right';\n\n /** @deprecated */\n @Prop({ reflect: true, mutable: true })\n ariaLabel: string;\n\n /** If `true`, component expands to fill the width of its parent element. */\n @Prop({ reflect: true })\n block: boolean;\n\n /**\n * Tells the outlet what the type of object being passed in as contextValue.\n * This will allow for the hierarchy resolution logic to work to determine if an option should or should not be shown.\n *\n * @info\n * Only applicable when using `<q2-dropdown>` for outlets.\n */\n @Prop({ reflect: true })\n context: string;\n\n /**\n * Passes important information to the outlet (e.g., pass an account id that your platform can use to look up what module to show for that account type).\n *\n * @info\n * Only applicable when using `<q2-dropdown>` for outlets.\n */\n @Prop({ reflect: true })\n contextValue: string;\n\n /** Indicates the menu cannot be focused or interacted with. */\n @Prop({ reflect: true })\n disabled: boolean;\n\n /**\n * Hide's the field's `<label>` element from view.\n * @warning\n * Only use when a visible label is impractical.\n */\n @Prop({ reflect: true, mutable: true })\n hideLabel: boolean;\n\n /**\n * Instructs the component to use the action sheet workflow for displaying its options.\n *\n * For more information, see [Action Sheets](https://tecton.q2developer.com/guides/action-sheets/).\n */\n @Prop()\n hoist: boolean = !!window.Tecton?.useActionSheets;\n\n /** The icon that will render within the toggle button. You may use any of the `q2-icon` types. */\n @Prop({ reflect: true })\n icon: string;\n\n /**\n * The text that appears within the button.\n * @warning\n * This property should not be used if the `type` is `icon`.\n * @localizable\n */\n @Prop({ reflect: true, mutable: true })\n label: string;\n\n /**\n * Identifies this menu as an outlet. Used in conjunction with context and, optionally, `contextValue`.\n * @info\n * Only applicable when using `<q2-dropdown>` for outlets.\n */\n @Prop({ reflect: true })\n name: string;\n\n /**\n * Determine whether the popover is open or closed.\n *\n * @readonly\n */\n @Prop({ reflect: true, mutable: true })\n open: boolean;\n\n /** Determines the label that is applied to the option list for accessibility purposes. */\n @Prop()\n optionListLabel: string;\n\n /** @deprecated */\n @Prop({ reflect: true })\n popDirection: 'up' | 'down';\n\n /** Aligns the popover dropdown to the left or right side of the input field. */\n @Prop({ mutable: true })\n popoverAlignment: 'left' | 'right' = 'left'; // being used in dropdown.scss\n\n /**\n * Force the direction of the popover dropdown when it opens.\n * If no value is passed, the component will auto-detect the direction based on available space.\n */\n @Prop({ mutable: true })\n popoverDirection: 'up' | 'down';\n\n /**\n * Force the maximum height of the popover. This value will be interpreted as pixels.\n * If no value is passed, or the value exceeds available space, the component will auto-detect the maximum height based on available space.\n */\n @Prop()\n popoverMaxHeight: number;\n\n /** @deprecated */\n @Prop()\n popoverMinHeight: number;\n\n /**\n * Determines the display mode of the popover.\n *\n * Providing a value of `legacy` instructs the popover to use absolute positioning instead of fixed positioning.\n *\n * @info\n * This is a temporary solution to work around styling issues related to using fixed positioning for the popover\n * when nested inside of elements with transform properties. This will be removed once the popover API is available\n * for use.\n */\n @Prop({ mutable: true })\n popoverMode: 'legacy' = null;\n\n /**\n * Use with `context` to tell the outlet where it appears. It will be matched with the appropriately configured module for that context.\n * @info\n * Only applicable when using `<q2-dropdown>` for outlets.\n */\n @Prop({ reflect: true })\n resolvedType: string;\n\n /** The type of button used as the menu toggle.\n * @info\n * Type must be \"custom\" to use the custom button slot.\n */\n @Prop({ reflect: true })\n type: 'icon' | 'fab' | 'custom' | 'primary' | 'secondary' | 'neutral' = 'icon';\n\n // #endregion\n // #region Component Lifecycle Events\n\n componentWillLoad() {\n this.popDirectionHandler();\n this.alignmentHandler();\n this.ariaLabelHandler();\n }\n\n componentDidLoad() {\n this.orchestrateResolvedMenuItems();\n overrideFocus(this.hostElement);\n }\n\n // #endregion\n // #region Listeners\n\n @Listen('focus')\n delegateFocus(event: FocusEvent) {\n if (!isEventFromElement(event, this.hostElement)) return;\n this.focusToggle();\n }\n\n @Listen('popoverStateChanged')\n popoverStateChangeHandler({ detail: { open } }: CustomEvent<{ open: boolean }>) {\n if (this.open !== open) this.open = open;\n this.popoverElement?.scrollContainerTo({ top: 0 });\n if (!open) {\n this.optionList.setActiveElement(null);\n }\n }\n\n // #endregion\n // #region Public Methods API\n\n /**\n * Emulates clicking the dropdown `<button>` to hide the popover if it is showing.\n * @testOnly\n */\n @Method()\n async closePopover() {\n if (!this.open || this.disabled) return;\n this._togglePopover();\n }\n\n /**\n * Emulates clicking the dropdown `<button>` to show the popover if it is hidden.\n * @testOnly\n */\n @Method()\n async openPopover() {\n if (this.open || this.disabled) return;\n this._togglePopover();\n }\n\n /**\n * Emulates opening the dropdown and selecting a [Dropdown Item](https://tecton.q2developer.com/design-system/q2-dropdown-item/).\n *\n * If the dropdown is closed, this will open it before selecting the item.\n *\n * If the value does not match any item's value, this method does nothing.\n * @testOnly\n */\n @Method()\n async selectItem(value: string) {\n const item = this.hostElement.querySelector<HTMLQ2DropdownItemElement>(\n `${this.dropdownItemSelector}[value=\"${value}\"]`\n );\n const itemBtn = item?.shadowRoot.querySelector<HTMLButtonElement>('.dropdown-item');\n if (!item || this.disabled) return;\n if (!this.open) {\n this.controlElement?.click();\n await waitForNextPaint();\n }\n itemBtn.click();\n await waitForNextPaint();\n }\n\n /**\n * Emulates opening the dropdown and selecting a [Dropdown Item](https://tecton.q2developer.com/design-system/q2-dropdown-item/)'s *remove* button.\n *\n * If the dropdown is closed, this will open it before selecting the remove item button.\n *\n * Requirements for this method to work properly:\n * - Provided `value` matches the item's `value` property\n * - Item has the `removable` property enabled\n * @testOnly\n */\n @Method()\n async selectRemoveItem(value: string) {\n const item = this.hostElement.querySelector<HTMLQ2DropdownItemElement>(\n `${this.dropdownItemSelector}[value=\"${value}\"]`\n );\n const removeButton = item?.shadowRoot.querySelector<HTMLButtonElement>('.remove-dropdown-item');\n if (!item || !removeButton || this.disabled) return;\n if (!this.open) {\n this.controlElement?.click();\n await waitForNextPaint();\n }\n removeButton.click();\n await waitForNextPaint();\n }\n\n // #endregion\n // #region Watchers\n\n @Watch('additionalContext')\n additionalContextHandler() {\n this.orchestrateResolvedMenuItems();\n }\n\n @Watch('alignment')\n alignmentHandler() {\n handleRenamedProp(this, 'alignment', 'popoverAlignment');\n }\n\n @Watch('ariaLabel')\n ariaLabelHandler() {\n handleAriaLabel(this);\n }\n\n @Watch('context')\n contextHandler() {\n this.orchestrateResolvedMenuItems();\n }\n\n @Watch('contextValue')\n contextValueHandler() {\n this.orchestrateResolvedMenuItems();\n }\n\n @Watch('name')\n nameHandler() {\n this.orchestrateResolvedMenuItems();\n }\n\n @Watch('popDirection')\n popDirectionHandler() {\n handleRenamedProp(this, 'popDirection', 'popoverDirection');\n }\n\n @Watch('resolvedType')\n resolvedTypeHandler() {\n this.orchestrateResolvedMenuItems();\n }\n\n // #endregion\n // #region Local Methods\n\n get determineDropdownItemCount() {\n return this.hostElement.querySelectorAll(this.dropdownItemSelector).length;\n }\n\n get hasCustomControl() {\n return !!this.hostElement.querySelector('[slot=control]');\n }\n\n get toggleButtonProps() {\n const allowedIntents = ['primary', 'secondary', 'neutral'];\n const allowedTypes = ['icon', 'fab', 'custom', ...allowedIntents];\n const type = allowedTypes.includes(this.type) ? this.type : '';\n const icon = type === 'icon';\n const fab = type === 'fab';\n const custom = type === 'custom';\n let intent;\n if (allowedIntents.includes(type)) {\n intent = type === 'neutral' ? type : `workflow-${type}`;\n }\n const active = this.open;\n const disabled = !!this.disabled;\n const ariaExpanded = this.open;\n const className = !icon && !fab && !intent ? 'unstyled' : '';\n\n return {\n icon,\n fab,\n intent,\n active,\n disabled,\n ariaExpanded,\n className,\n custom,\n };\n }\n\n _clickItem(value: string) {\n if (!value || this.disabled) return;\n const item = this.hostElement.querySelector<HTMLQ2DropdownItemElement>(\n `${this.dropdownItemSelector}[value=\"${value}\"]`\n );\n const option = this.hostElement.querySelector<HTMLQ2OptionElement>(`${this.optionSelector}[value=\"${value}\"]`);\n item?.shadowRoot.querySelector<HTMLButtonElement>('.dropdown-item')?.click();\n option?.click();\n }\n\n async _handleActionSheet(event: MouseEvent | KeyboardEvent) {\n const { value } = await showActionSheetList(this, event);\n this._clickItem(value);\n this.controlElement.focus();\n }\n\n _togglePopover() {\n const { controlElement } = this;\n if (!controlElement) return;\n controlElement.click();\n controlElement.focus();\n controlElement.dispatchEvent(new FocusEvent('focus'));\n }\n\n focusToggle = () => {\n this.controlElement.focus();\n };\n\n handleFocusOut = (event: FocusEvent) => {\n const relatedTarget = event.relatedTarget as unknown as HTMLElement;\n if (this.popoverElement?.contains(relatedTarget)) return;\n if (this.hostElement.contains(relatedTarget)) return;\n this.open = false;\n };\n\n onClickElsewhere = (event: CustomEvent) => {\n const target = event.target as HTMLElement;\n if (target.localName === 'q2-option-list') {\n event.stopPropagation();\n }\n if (target.localName === 'click-elsewhere') {\n event.stopPropagation();\n const { popoverElement } = this;\n if (!popoverElement) return;\n popoverElement.open = false;\n }\n };\n\n onPopoverState = (event: CustomEvent<{ open: boolean; action: string }>) => {\n if (event.detail.open) return;\n this.controlElement.focus();\n };\n\n onToggleClick = async (event: MouseEvent) => {\n event.stopPropagation();\n if (shouldShowActionSheet(this)) {\n this._handleActionSheet(event);\n } else {\n await this.popoverElement.toggle();\n }\n };\n\n onToggleKeydown = async (event: KeyboardEvent) => {\n const isTabMetaOrCtrl = event.metaKey || event.ctrlKey || event.key === 'Tab';\n if (isTabMetaOrCtrl) return;\n\n event.preventDefault();\n if (shouldShowActionSheet(this, event)) {\n this._handleActionSheet(event);\n } else {\n this.optionList.handleExternalKeydown(event);\n }\n };\n\n orchestrateResolvedMenuItems() {\n if (!this.name || !this.context) {\n // this is only for contextual menu outlets\n this.removeResolvedElements();\n return;\n }\n\n this.resolveMenuItemElements()\n .then(data => {\n this.removeResolvedElements();\n data.forEach(element => {\n this.hostElement.appendChild(element);\n });\n })\n .catch(err => {\n this.removeResolvedElements();\n throw err;\n });\n }\n\n removeResolvedElements() {\n const resolvedElements = this.hostElement.querySelectorAll('q2-dropdown-item.resolved-menu-item');\n resolvedElements.forEach(element => this.hostElement.removeChild(element));\n }\n\n resolveMenu() {\n return (\n this.name &&\n window.TectonElements &&\n window.TectonElements.resolveMenu(this.name, this.contextValue, this.resolvedType, this.additionalContext)\n );\n }\n\n resolveMenuItemElements() {\n return this.resolveMenu().then(datas => {\n return datas.map(menuItemData => {\n let onClickFn;\n let queryParams;\n if (menuItemData['tct-ctxid']) {\n queryParams = {};\n queryParams[menuItemData.contextIdParamName] = menuItemData['tct-ctxid'];\n }\n\n switch (menuItemData.action) {\n case 'navigateTo':\n onClickFn = function () {\n return window.TectonElements?.navigateTo?.(\n menuItemData.featureName,\n menuItemData.moduleName,\n queryParams\n );\n };\n break;\n case 'showOverpanel':\n onClickFn = function () {\n return window.TectonElements?.showOverpanel?.(\n `${menuItemData.featureName}.${menuItemData.moduleName}`,\n queryParams,\n undefined,\n true\n );\n };\n break;\n }\n\n const newDropdownItem = document.createElement('q2-dropdown-item');\n newDropdownItem.setAttribute('value', menuItemData.itemLabel);\n newDropdownItem.classList.add('resolved-menu-item');\n newDropdownItem.textContent = menuItemData.itemLabel;\n newDropdownItem.onclick = onClickFn;\n\n return newDropdownItem;\n });\n });\n }\n\n // #endregion\n // #region Render Methods\n\n render() {\n const btnProps = this.toggleButtonProps;\n\n return (\n <click-elsewhere\n class={this.open ? 'dropdown-open' : ''}\n onChange={this.onClickElsewhere}\n test-id=\"dropdownContainer\"\n >\n <q2-btn\n ref={el => (this.controlElement = el)}\n class={btnProps.className}\n onClick={this.onToggleClick}\n onKeyDown={this.onToggleKeydown}\n fab={btnProps.fab}\n intent={btnProps.intent}\n onFocusout={this.handleFocusOut}\n active={btnProps.active}\n disabled={btnProps.disabled}\n ariaExpanded={`${!!btnProps.ariaExpanded}`}\n label={this.hideLabel && this.label ? loc(this.label) : undefined}\n hideLabel={this.hideLabel}\n ariaHasPopup=\"menu\"\n test-id=\"dropdownButton\"\n block={this.block}\n description={loc('tecton.element.dropdown.itemCount', [this.determineDropdownItemCount])}\n >\n {this.hasCustomControl ? (\n <div\n test-id=\"dropdownControl\"\n class={btnProps.custom ? '' : 'hidden'}\n >\n <slot name=\"control\" />\n </div>\n ) : (\n <Fragment>\n {this.icon ? <q2-icon type={this.icon} /> : ' '}\n {this.label && !this.hideLabel && (\n <span class=\"dropdown-button-text\">{loc(this.label)}</span>\n )}\n </Fragment>\n )}\n </q2-btn>\n <q2-popover\n ref={el => (this.popoverElement = el)}\n controlElement={this.controlElement}\n open={this.open}\n max-height={this.popoverMaxHeight}\n onFocusout={this.handleFocusOut}\n minHeight={this.popoverMinHeight}\n direction={this.popoverDirection}\n align={this.popoverAlignment}\n mode={this.popoverMode || undefined}\n block={this.block}\n >\n <q2-option-list\n onPopoverState={this.onPopoverState}\n id=\"option-list\"\n ref={el => (this.optionList = el)}\n type=\"menu\"\n label={loc('tecton.element.optionList.label', [this.optionListLabel])}\n no-select\n >\n <slot />\n </q2-option-list>\n </q2-popover>\n </click-elsewhere>\n );\n }\n\n // #endregion\n}\n"]}
1
+ {"version":3,"file":"q2-dropdown.js","sourceRoot":"","sources":["../../../../src/components/q2-dropdown/q2-dropdown.tsx"],"names":[],"mappings":"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","sourcesContent":["import { shouldShowActionSheet, showActionSheetList } from '@/utils/action-sheet';\nimport { Component, ComponentInterface, Prop, Method, Element, Watch, h, Fragment, Listen } from '@stencil/core';\nimport {\n handleAriaLabel,\n handleRenamedProp,\n isEventFromElement,\n loc,\n overrideFocus,\n waitForNextPaint,\n} from 'src/utils';\n\n/** @slot control - An optional slot to provide custom content as the clickable interface. The Dropdown **must** have `type=\"custom\"` to use the control slot. */\n@Component({ tag: 'q2-dropdown', shadow: true, styleUrl: 'q2-dropdown.scss' })\nexport class Q2Dropdown implements ComponentInterface {\n // #region Own Properties\n\n controlElement?: HTMLQ2BtnElement;\n dropdownItemSelector: string = 'q2-dropdown-item:not([disabled]):not([separator])';\n optionSelector: string = 'q2-option:not([disabled]):not([separator])';\n optionList: HTMLQ2OptionListElement;\n popoverElement?: HTMLQ2PopoverElement;\n\n // #endregion\n // #region Host HTML Element\n\n @Element()\n hostElement: HTMLElement;\n\n // #endregion\n // #region Public Property API\n\n @Prop({ reflect: true })\n additionalContext: string;\n\n /** @deprecated */\n @Prop({ reflect: true })\n alignment: 'left' | 'right';\n\n /** @deprecated */\n @Prop({ reflect: true, mutable: true })\n ariaLabel: string;\n\n /** If `true`, component expands to fill the width of its parent element. */\n @Prop({ reflect: true })\n block: boolean;\n\n /**\n * Tells the outlet what the type of object being passed in as contextValue.\n * This will allow for the hierarchy resolution logic to work to determine if an option should or should not be shown.\n *\n * @info\n * Only applicable when using `<q2-dropdown>` for outlets.\n */\n @Prop({ reflect: true })\n context: string;\n\n /**\n * Passes important information to the outlet (e.g., pass an account id that your platform can use to look up what module to show for that account type).\n *\n * @info\n * Only applicable when using `<q2-dropdown>` for outlets.\n */\n @Prop({ reflect: true })\n contextValue: string;\n\n /** Indicates the menu cannot be focused or interacted with. */\n @Prop({ reflect: true })\n disabled: boolean;\n\n /**\n * Hide's the field's `<label>` element from view.\n * @warning\n * Only use when a visible label is impractical.\n */\n @Prop({ reflect: true, mutable: true })\n hideLabel: boolean;\n\n /**\n * Instructs the component to use the action sheet workflow for displaying its options.\n *\n * For more information, see [Action Sheets](https://tecton.q2developer.com/guides/action-sheets/).\n */\n @Prop()\n hoist: boolean = !!window.Tecton?.useActionSheets;\n\n /** The icon that will render within the toggle button. You may use any of the `q2-icon` types. */\n @Prop({ reflect: true })\n icon: string;\n\n /**\n * The text that appears within the button.\n * @warning\n * This property should not be used if the `type` is `icon`.\n * @localizable\n */\n @Prop({ reflect: true, mutable: true })\n label: string;\n\n /**\n * Identifies this menu as an outlet. Used in conjunction with context and, optionally, `contextValue`.\n * @info\n * Only applicable when using `<q2-dropdown>` for outlets.\n */\n @Prop({ reflect: true })\n name: string;\n\n /**\n * Determine whether the popover is open or closed.\n *\n * @readonly\n */\n @Prop({ reflect: true, mutable: true })\n open: boolean;\n\n /** Determines the label that is applied to the option list for accessibility purposes. */\n @Prop()\n optionListLabel: string;\n\n /** @deprecated */\n @Prop({ reflect: true })\n popDirection: 'up' | 'down';\n\n /** Aligns the popover dropdown to the left or right side of the input field. */\n @Prop({ mutable: true })\n popoverAlignment: 'left' | 'right' = 'left'; // being used in dropdown.scss\n\n /**\n * Force the direction of the popover dropdown when it opens.\n * If no value is passed, the component will auto-detect the direction based on available space.\n */\n @Prop({ mutable: true })\n popoverDirection: 'up' | 'down';\n\n /**\n * Force the maximum height of the popover. This value will be interpreted as pixels.\n * If no value is passed, or the value exceeds available space, the component will auto-detect the maximum height based on available space.\n */\n @Prop()\n popoverMaxHeight: number;\n\n /** @deprecated */\n @Prop()\n popoverMinHeight: number;\n\n /**\n * Determines the display mode of the popover.\n *\n * Providing a value of `legacy` instructs the popover to use absolute positioning instead of fixed positioning.\n *\n * @info\n * This is a temporary solution to work around styling issues related to using fixed positioning for the popover\n * when nested inside of elements with transform properties. This will be removed once the popover API is available\n * for use.\n */\n @Prop({ mutable: true })\n popoverMode: 'legacy' = null;\n\n /**\n * Use with `context` to tell the outlet where it appears. It will be matched with the appropriately configured module for that context.\n * @info\n * Only applicable when using `<q2-dropdown>` for outlets.\n */\n @Prop({ reflect: true })\n resolvedType: string;\n\n /** The type of button used as the menu toggle.\n * @info\n * Type must be \"custom\" to use the custom button slot.\n */\n @Prop({ reflect: true })\n type: 'icon' | 'fab' | 'custom' | 'primary' | 'secondary' | 'neutral' = 'icon';\n\n // #endregion\n // #region Component Lifecycle Events\n\n componentWillLoad() {\n this.popDirectionHandler();\n this.alignmentHandler();\n this.ariaLabelHandler();\n }\n\n componentDidLoad() {\n this.orchestrateResolvedMenuItems();\n overrideFocus(this.hostElement);\n }\n\n // #endregion\n // #region Listeners\n\n @Listen('focus')\n delegateFocus(event: FocusEvent) {\n if (!isEventFromElement(event, this.hostElement)) return;\n this.focusToggle();\n }\n\n @Listen('popoverStateChanged')\n popoverStateChangeHandler({ detail: { open } }: CustomEvent<{ open: boolean }>) {\n if (this.open !== open) this.open = open;\n this.popoverElement?.scrollContainerTo({ top: 0 });\n if (!open) {\n this.optionList.setActiveElement(null);\n }\n }\n\n // #endregion\n // #region Public Methods API\n\n /**\n * Emulates clicking the dropdown `<button>` to hide the popover if it is showing.\n * @testOnly\n */\n @Method()\n async closePopover() {\n if (!this.open || this.disabled) return;\n this._togglePopover();\n }\n\n /**\n * Emulates clicking the dropdown `<button>` to show the popover if it is hidden.\n * @testOnly\n */\n @Method()\n async openPopover() {\n if (this.open || this.disabled) return;\n this._togglePopover();\n }\n\n /**\n * Emulates opening the dropdown and selecting a [Dropdown Item](https://tecton.q2developer.com/design-system/q2-dropdown-item/).\n *\n * If the dropdown is closed, this will open it before selecting the item.\n *\n * If the value does not match any item's value, this method does nothing.\n * @testOnly\n */\n @Method()\n async selectItem(value: string) {\n const item = this.hostElement.querySelector<HTMLQ2DropdownItemElement>(\n `${this.dropdownItemSelector}[value=\"${value}\"]`\n );\n const itemBtn = item?.shadowRoot.querySelector<HTMLButtonElement>('.dropdown-item');\n if (!item || this.disabled) return;\n if (!this.open) {\n this.controlElement?.click();\n await waitForNextPaint();\n }\n itemBtn.click();\n await waitForNextPaint();\n }\n\n /**\n * Emulates opening the dropdown and selecting a [Dropdown Item](https://tecton.q2developer.com/design-system/q2-dropdown-item/)'s *remove* button.\n *\n * If the dropdown is closed, this will open it before selecting the remove item button.\n *\n * Requirements for this method to work properly:\n * - Provided `value` matches the item's `value` property\n * - Item has the `removable` property enabled\n * @testOnly\n */\n @Method()\n async selectRemoveItem(value: string) {\n const item = this.hostElement.querySelector<HTMLQ2DropdownItemElement>(\n `${this.dropdownItemSelector}[value=\"${value}\"]`\n );\n const removeButton = item?.shadowRoot.querySelector<HTMLButtonElement>('.remove-dropdown-item');\n if (!item || !removeButton || this.disabled) return;\n if (!this.open) {\n this.controlElement?.click();\n await waitForNextPaint();\n }\n removeButton.click();\n await waitForNextPaint();\n }\n\n // #endregion\n // #region Watchers\n\n @Watch('additionalContext')\n additionalContextHandler() {\n this.orchestrateResolvedMenuItems();\n }\n\n @Watch('alignment')\n alignmentHandler() {\n handleRenamedProp(this, 'alignment', 'popoverAlignment');\n }\n\n @Watch('ariaLabel')\n ariaLabelHandler() {\n handleAriaLabel(this);\n }\n\n @Watch('context')\n contextHandler() {\n this.orchestrateResolvedMenuItems();\n }\n\n @Watch('contextValue')\n contextValueHandler() {\n this.orchestrateResolvedMenuItems();\n }\n\n @Watch('name')\n nameHandler() {\n this.orchestrateResolvedMenuItems();\n }\n\n @Watch('popDirection')\n popDirectionHandler() {\n handleRenamedProp(this, 'popDirection', 'popoverDirection');\n }\n\n @Watch('resolvedType')\n resolvedTypeHandler() {\n this.orchestrateResolvedMenuItems();\n }\n\n // #endregion\n // #region Local Methods\n\n get determineDropdownItemCount() {\n return this.hostElement.querySelectorAll(this.dropdownItemSelector).length;\n }\n\n get hasCustomControl() {\n return !!this.hostElement.querySelector('[slot=control]');\n }\n\n get toggleButtonProps() {\n const allowedIntents = ['primary', 'secondary', 'neutral'];\n const allowedTypes = ['icon', 'fab', 'custom', ...allowedIntents];\n const type = allowedTypes.includes(this.type) ? this.type : '';\n const icon = type === 'icon';\n const fab = type === 'fab';\n const custom = type === 'custom';\n let intent;\n if (allowedIntents.includes(type)) {\n intent = type === 'neutral' ? type : `workflow-${type}`;\n }\n const active = this.open;\n const disabled = !!this.disabled;\n const ariaExpanded = this.open;\n const className = !icon && !fab && !intent ? 'unstyled' : '';\n\n return {\n icon,\n fab,\n intent,\n active,\n disabled,\n ariaExpanded,\n className,\n custom,\n };\n }\n\n _clickItem(value: string) {\n if (!value || this.disabled) return;\n const item = this.hostElement.querySelector<HTMLQ2DropdownItemElement>(\n `${this.dropdownItemSelector}[value=\"${value}\"]`\n );\n const option = this.hostElement.querySelector<HTMLQ2OptionElement>(`${this.optionSelector}[value=\"${value}\"]`);\n item?.shadowRoot.querySelector<HTMLButtonElement>('.dropdown-item')?.click();\n option?.click();\n }\n\n async _handleActionSheet(event: MouseEvent | KeyboardEvent) {\n const { value } = await showActionSheetList(this, event);\n this._clickItem(value);\n this.controlElement.focus();\n }\n\n _togglePopover() {\n const { controlElement } = this;\n if (!controlElement) return;\n controlElement.click();\n controlElement.focus();\n controlElement.dispatchEvent(new FocusEvent('focus'));\n }\n\n focusToggle = () => {\n this.controlElement.focus();\n };\n\n handleFocusOut = (event: FocusEvent) => {\n const relatedTarget = event.relatedTarget as unknown as HTMLElement;\n if (this.popoverElement?.contains(relatedTarget)) return;\n if (this.hostElement.contains(relatedTarget)) return;\n this.open = false;\n };\n\n onClickElsewhere = (event: CustomEvent) => {\n const target = event.target as HTMLElement;\n if (target.localName === 'q2-option-list') {\n event.stopPropagation();\n }\n if (target.localName === 'click-elsewhere') {\n event.stopPropagation();\n const { popoverElement } = this;\n if (!popoverElement) return;\n popoverElement.open = false;\n }\n };\n\n onPopoverState = (event: CustomEvent<{ open: boolean; action: string }>) => {\n if (event.detail.open) return;\n this.controlElement.focus();\n };\n\n onToggleClick = async (event: MouseEvent) => {\n event.stopPropagation();\n this.popoverElement.controlElement = this.controlElement;\n if (shouldShowActionSheet(this)) {\n this._handleActionSheet(event);\n } else {\n await this.popoverElement.toggle();\n }\n };\n\n onToggleKeydown = async (event: KeyboardEvent) => {\n const isTabMetaOrCtrl = event.metaKey || event.ctrlKey || event.key === 'Tab';\n if (isTabMetaOrCtrl) return;\n\n event.preventDefault();\n this.popoverElement.controlElement = this.controlElement;\n if (shouldShowActionSheet(this, event)) {\n this._handleActionSheet(event);\n } else {\n this.optionList.handleExternalKeydown(event);\n }\n };\n\n orchestrateResolvedMenuItems() {\n if (!this.name || !this.context) {\n // this is only for contextual menu outlets\n this.removeResolvedElements();\n return;\n }\n\n this.resolveMenuItemElements()\n .then(data => {\n this.removeResolvedElements();\n data.forEach(element => {\n this.hostElement.appendChild(element);\n });\n })\n .catch(err => {\n this.removeResolvedElements();\n throw err;\n });\n }\n\n removeResolvedElements() {\n const resolvedElements = this.hostElement.querySelectorAll('q2-dropdown-item.resolved-menu-item');\n resolvedElements.forEach(element => this.hostElement.removeChild(element));\n }\n\n resolveMenu() {\n return (\n this.name &&\n window.TectonElements &&\n window.TectonElements.resolveMenu(this.name, this.contextValue, this.resolvedType, this.additionalContext)\n );\n }\n\n resolveMenuItemElements() {\n return this.resolveMenu().then(datas => {\n return datas.map(menuItemData => {\n let onClickFn;\n let queryParams;\n if (menuItemData['tct-ctxid']) {\n queryParams = {};\n queryParams[menuItemData.contextIdParamName] = menuItemData['tct-ctxid'];\n }\n\n switch (menuItemData.action) {\n case 'navigateTo':\n onClickFn = function () {\n return window.TectonElements?.navigateTo?.(\n menuItemData.featureName,\n menuItemData.moduleName,\n queryParams\n );\n };\n break;\n case 'showOverpanel':\n onClickFn = function () {\n return window.TectonElements?.showOverpanel?.(\n `${menuItemData.featureName}.${menuItemData.moduleName}`,\n queryParams,\n undefined,\n true\n );\n };\n break;\n }\n\n const newDropdownItem = document.createElement('q2-dropdown-item');\n newDropdownItem.setAttribute('value', menuItemData.itemLabel);\n newDropdownItem.classList.add('resolved-menu-item');\n newDropdownItem.textContent = menuItemData.itemLabel;\n newDropdownItem.onclick = onClickFn;\n\n return newDropdownItem;\n });\n });\n }\n\n // #endregion\n // #region Render Methods\n\n render() {\n const btnProps = this.toggleButtonProps;\n\n return (\n <click-elsewhere\n class={this.open ? 'dropdown-open' : ''}\n onChange={this.onClickElsewhere}\n test-id=\"dropdownContainer\"\n >\n <q2-btn\n ref={el => (this.controlElement = el)}\n class={btnProps.className}\n onClick={this.onToggleClick}\n onKeyDown={this.onToggleKeydown}\n fab={btnProps.fab}\n intent={btnProps.intent}\n onFocusout={this.handleFocusOut}\n active={btnProps.active}\n disabled={btnProps.disabled}\n ariaExpanded={`${!!btnProps.ariaExpanded}`}\n label={this.hideLabel && this.label ? loc(this.label) : undefined}\n hideLabel={this.hideLabel}\n ariaHasPopup=\"menu\"\n test-id=\"dropdownButton\"\n block={this.block}\n description={loc('tecton.element.dropdown.itemCount', [this.determineDropdownItemCount])}\n >\n {this.hasCustomControl ? (\n <div\n test-id=\"dropdownControl\"\n class={btnProps.custom ? '' : 'hidden'}\n >\n <slot name=\"control\" />\n </div>\n ) : (\n <Fragment>\n {this.icon ? <q2-icon type={this.icon} /> : ' '}\n {this.label && !this.hideLabel && (\n <span class=\"dropdown-button-text\">{loc(this.label)}</span>\n )}\n </Fragment>\n )}\n </q2-btn>\n <q2-popover\n ref={el => (this.popoverElement = el)}\n controlElement={this.controlElement}\n open={this.open}\n max-height={this.popoverMaxHeight}\n onFocusout={this.handleFocusOut}\n minHeight={this.popoverMinHeight}\n direction={this.popoverDirection}\n align={this.popoverAlignment}\n mode={this.popoverMode || undefined}\n block={this.block}\n >\n <q2-option-list\n onPopoverState={this.onPopoverState}\n id=\"option-list\"\n ref={el => (this.optionList = el)}\n type=\"menu\"\n label={loc('tecton.element.optionList.label', [this.optionListLabel])}\n no-select\n >\n <slot />\n </q2-option-list>\n </q2-popover>\n </click-elsewhere>\n );\n }\n\n // #endregion\n}\n"]}
@@ -1,5 +1,5 @@
1
1
  import { h, } from "@stencil/core";
2
- import { handleDeprecationWarning, waitForNextPaint } from "../../utils";
2
+ import { handleDeprecationWarning, waitForNextPaint, isMobile, isInScrollableContainer } from "../../utils";
3
3
  /**
4
4
  * ***********
5
5
  * * WARNING *
@@ -63,7 +63,7 @@ export class Q2Popover {
63
63
  containerElement.style.setProperty('--comp-pop-opacity', '1');
64
64
  };
65
65
  this.setPopoverAPICSSProperties = async () => {
66
- var _a, _b, _c, _d, _e, _f;
66
+ var _a, _b, _c;
67
67
  const { controlElement, containerElement, currentDirection, isModule, align } = this;
68
68
  const { top: controlTop, bottom: controlBottom, left: controlLeft, right: controlRight, } = (_b = (_a = controlElement === null || controlElement === void 0 ? void 0 : controlElement.getBoundingClientRect) === null || _a === void 0 ? void 0 : _a.call(controlElement)) !== null && _b !== void 0 ? _b : {
69
69
  top: 0,
@@ -88,7 +88,7 @@ export class Q2Popover {
88
88
  containerElement.style.setProperty('--comp-pop-bottom', `${window.innerHeight - controlTop}px`);
89
89
  }
90
90
  else {
91
- containerElement.style.setProperty('--comp-pop-bottom', `${window.innerHeight - controlTop - ((_d = window === null || window === void 0 ? void 0 : window.visualViewport) === null || _d === void 0 ? void 0 : _d.offsetTop) - window.scrollY}px`);
91
+ containerElement.style.setProperty('--comp-pop-bottom', `${window.innerHeight - controlTop - window.scrollY}px`);
92
92
  }
93
93
  }
94
94
  if (currentDirection === 'down') {
@@ -96,7 +96,7 @@ export class Q2Popover {
96
96
  containerElement.style.setProperty('--comp-pop-top', `${controlBottom}px`);
97
97
  }
98
98
  else {
99
- containerElement.style.setProperty('--comp-pop-top', `${controlBottom + ((_f = (_e = window === null || window === void 0 ? void 0 : window.visualViewport) === null || _e === void 0 ? void 0 : _e.offsetTop) !== null && _f !== void 0 ? _f : 0) + window.scrollY}px`);
99
+ containerElement.style.setProperty('--comp-pop-top', `${controlBottom + window.scrollY}px`);
100
100
  }
101
101
  }
102
102
  // Wait for one paint to prevent layout thrashing
@@ -215,7 +215,9 @@ export class Q2Popover {
215
215
  var _a;
216
216
  window.addEventListener('resize', this.viewPortOrientationChanged);
217
217
  visualViewport === null || visualViewport === void 0 ? void 0 : visualViewport.addEventListener('resize', this.viewPortChanged);
218
- window.addEventListener('scroll', this.viewPortChanged, { passive: true, capture: true });
218
+ if (isInScrollableContainer(this.hostElement) && !isMobile()) {
219
+ window.addEventListener('scroll', this.viewPortChanged, { passive: true, capture: true });
220
+ }
219
221
  (_a = screen === null || screen === void 0 ? void 0 : screen.orientation) === null || _a === void 0 ? void 0 : _a.addEventListener('orientationchange', this.viewPortOrientationChanged);
220
222
  window.addEventListener('orientationchange', this.viewPortOrientationChanged);
221
223
  }
@@ -243,20 +245,23 @@ export class Q2Popover {
243
245
  let maxSpaceAbove;
244
246
  let maxSpaceBelow;
245
247
  if (isModule) {
246
- const { outletOffset = 0, innerHeight = window.innerHeight } = ((_c = window.Tecton) === null || _c === void 0 ? void 0 : _c.platformDimensions) || {};
247
- const distanceToIframeBottom = window.visualViewport.height - controlBottom;
248
- const viewableSpaceBelow = innerHeight - (outletOffset + controlBottom);
248
+ const { outletOffset = 0, innerHeight = window.innerHeight, top: topBarHeight = 0, bottom: bottomBarHeight = 0, } = ((_c = window.Tecton) === null || _c === void 0 ? void 0 : _c.platformDimensions) || {};
249
+ const distanceToIframeBottom = window.innerHeight - controlBottom;
250
+ // controlElement position visually on the page
251
+ const visualControlTop = outletOffset > 0 ? controlTop : controlTop + outletOffset - topBarHeight;
252
+ const visualControlBottom = outletOffset + controlBottom - topBarHeight;
253
+ // visual space around the controlElement
254
+ const viewableSpaceAbove = visualControlTop;
255
+ const viewableSpaceBelow = innerHeight - bottomBarHeight - visualControlBottom;
256
+ // calculate space above and below controlElement
249
257
  const isIframeShorterThanWindow = distanceToIframeBottom < viewableSpaceBelow;
250
- windowHeight = innerHeight;
251
- // If the top of the module is below the top of the window we just use the controlTop
252
- // Otherwise we need to add the outletOffset to the controlTop
253
- maxSpaceAbove = (outletOffset > 0 ? controlTop : controlTop + outletOffset) - displayBuffer;
258
+ maxSpaceAbove = viewableSpaceAbove - displayBuffer;
254
259
  maxSpaceBelow = isIframeShorterThanWindow
255
260
  ? distanceToIframeBottom - displayBuffer
256
261
  : viewableSpaceBelow - displayBuffer;
257
262
  }
258
263
  else {
259
- windowHeight = window.visualViewport.height;
264
+ windowHeight = window.innerHeight;
260
265
  maxSpaceAbove = controlTop - displayBuffer;
261
266
  maxSpaceBelow = windowHeight - controlBottom - displayBuffer;
262
267
  }
@@ -321,7 +326,7 @@ export class Q2Popover {
321
326
  containerClasses.push('block');
322
327
  if (this.mode === 'legacy')
323
328
  containerClasses.push('legacy');
324
- return (h("div", { key: 'c9bbcb53ba8f8bb8879d96cd2f828943dea32b92', ref: el => (this.containerElement = el), class: containerClasses.join(' '), "test-id": "outerContainer", tabIndex: -1, popover: "auto" }, h("div", { key: '4088186bfb7b320fcd8836bcef40b90a685caf9e', ref: el => (this.contentElement = el), class: "content" }, h("slot", { key: '0876866b03a8708a0b401df638d3146263afc141' }))));
329
+ return (h("div", { key: '4c79a6d47eb532ea80987757424ef83e2b41af3a', ref: el => (this.containerElement = el), class: containerClasses.join(' '), "test-id": "outerContainer", tabIndex: -1, popover: "manual" }, h("div", { key: '86fe5c9902e995ddb03602d510f14da62a319f15', ref: el => (this.contentElement = el), class: "content" }, h("slot", { key: '1d67d359c40caaaa94f6604c113c499a2b6f0e9e' }))));
325
330
  }
326
331
  static get is() { return "q2-popover"; }
327
332
  static get encapsulation() { return "shadow"; }
@@ -1 +1 @@
1
- {"version":3,"file":"q2-popover.js","sourceRoot":"","sources":["../../../../src/components/q2-popover/q2-popover.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n Prop,\n h,\n ComponentInterface,\n Element,\n Watch,\n Method,\n Listen,\n EventEmitter,\n Event,\n State,\n} from '@stencil/core';\nimport { handleDeprecationWarning, waitForNextPaint } from '../../utils';\n\n/**\n * ***********\n * * WARNING *\n * ***********\n * Touching this file obligates you to manually test thoroughly, because Puppeteer can't capture every edgecase.\n *\n * Each of the following Scenarios must be tested on each Device, in each Environment.\n *\n * Scenarios:\n * - Q2 Select non-typeable\n * - Q2 Select typeable\n *\n * Devices:\n * - iOS Safari\n * - Android Chrome\n * - MacOS Safari\n * - Chrome\n * - Firefox\n *\n * Environments:\n * - Standard (Outside of Iframe)\n * - SDK Extension (Inside of Iframe)\n */\n\n@Component({ tag: 'q2-popover', shadow: true, styleUrl: 'q2-popover.scss' })\nexport class Q2Popover implements ComponentInterface {\n // #region Own Properties\n\n containerElement: HTMLDivElement;\n contentElement: HTMLDivElement;\n /**\n * The number of pixels to leave between the popover and the edge of the viewport\n */\n displayBuffer = 10;\n orientationChanged: boolean = false;\n\n // #endregion\n // #region Host HTML Element\n\n @Element()\n hostElement: HTMLElement;\n\n // #endregion\n // #region State Properties\n\n @State()\n currentDirection: 'down' | 'up' = undefined;\n\n // remove `show` when Popover API is supported in iOS\n @State()\n show: boolean = false;\n\n // #endregion\n // #region Public Property API\n\n /** Aligns the popover to the left or right side of the control element. */\n @Prop({ reflect: true })\n align: 'left' | 'right' = 'left';\n\n /** Indicates the popover will match the width of its parent element. */\n @Prop({ reflect: true })\n block: boolean;\n\n /** The element that controls the popover's behavior. */\n @Prop()\n controlElement: HTMLElement;\n\n /**\n * Force the direction of the popover when it opens.\n * If no value is passed, the component will auto-detect the direction based on available space.\n */\n @Prop({ reflect: true })\n direction: 'up' | 'down';\n\n /**\n * Force the maximum height of the popover. This value will be interpreted as pixels.\n * If no value is passed, or the value exceeds available space, the component will auto-detect the maximum height based on available space.\n */\n @Prop()\n maxHeight: number;\n\n /** @deprecated */\n @Prop()\n minHeight: number;\n\n @Prop()\n mode: 'legacy' = null;\n\n /** Controls whether the popover is open or closed. */\n @Prop({ reflect: true, mutable: true })\n open: boolean;\n\n // #endregion\n // #region Events\n\n /**\n * Emitted when the popover is opened or closed.\n */\n @Event()\n popoverStateChanged: EventEmitter<{ open: boolean }>;\n\n // #endregion\n // #region Component Lifecycle Events\n\n disconnectedCallback() {\n this.removeViewportListeners();\n this.containerElement.removeEventListener('toggle', this.handlePopoverToggleEvent);\n this.containerElement = null;\n this.contentElement = null;\n this.controlElement = null;\n }\n\n componentWillLoad() {\n if (!this.supportsPopoverAPI) {\n console.warn(\n 'The Popover API is not supported in this browser. Please update your browser to the latest version. The component will use legacy mode.'\n );\n this.mode = 'legacy';\n }\n }\n\n componentDidLoad() {\n this.handleMinHeight();\n if (this.supportsPopoverAPI) this.containerElement.addEventListener('toggle', this.handlePopoverToggleEvent);\n if (this.open) this.determinePopDirection();\n }\n\n // #endregion\n // #region Listeners\n\n @Listen('popoverState')\n popoverStateHandler(event: CustomEvent<{ open: boolean }>) {\n const {\n detail: { open },\n } = event;\n if (open === this.open) return;\n\n this.open = open;\n event.stopPropagation();\n }\n\n // #endregion\n // #region Public Methods API\n\n @Method()\n async scrollContainerTo(options: ScrollToOptions) {\n this.containerElement.scrollTo(options);\n }\n\n @Method()\n async toggle() {\n this.open = !this.open;\n }\n\n // #endregion\n // #region Watchers\n\n @Watch('minHeight')\n minHeightProvided() {\n this.handleMinHeight();\n }\n\n @Watch('open')\n async openChanged(open: boolean) {\n this.popoverStateChanged.emit({ open });\n\n if (open) {\n this.addViewportListeners();\n this.determinePopDirection();\n } else {\n this.removeViewportListeners();\n this.currentDirection = undefined;\n if (this.mode === 'legacy' || !this.supportsPopoverAPI) {\n this.show = false;\n } else {\n this.containerElement.hidePopover();\n }\n\n await waitForNextPaint();\n this.clearCSSProperties();\n }\n }\n\n // #endregion\n // #region Local Methods\n\n get isModule() {\n const isIframe = window !== window.top;\n const hasPlatformDimensions = Object.keys(window.Tecton?.platformDimensions ?? {}).length > 0;\n return isIframe && hasPlatformDimensions;\n }\n\n get providedDirection(): 'up' | 'down' | undefined {\n const { direction } = this;\n switch (direction) {\n case 'up':\n case 'down':\n return direction;\n default:\n return undefined;\n }\n }\n\n get supportsPopoverAPI(): boolean {\n return Object.hasOwn(HTMLElement.prototype, 'popover');\n }\n\n get validatedMaxHeight(): number | undefined {\n const { maxHeight } = this;\n return isNaN(maxHeight) ? undefined : maxHeight;\n }\n\n addViewportListeners() {\n window.addEventListener('resize', this.viewPortOrientationChanged);\n visualViewport?.addEventListener('resize', this.viewPortChanged);\n window.addEventListener('scroll', this.viewPortChanged, { passive: true, capture: true });\n screen?.orientation?.addEventListener('orientationchange', this.viewPortOrientationChanged);\n window.addEventListener('orientationchange', this.viewPortOrientationChanged);\n }\n\n clearCSSProperties() {\n this.containerElement.style.removeProperty('--comp-pop-max-height');\n this.containerElement.style.removeProperty('--comp-pop-top');\n this.containerElement.style.removeProperty('--comp-pop-bottom');\n this.containerElement.style.removeProperty('--comp-pop-left');\n this.containerElement.style.removeProperty('--comp-pop-right');\n this.containerElement.style.removeProperty('--comp-pop-width');\n this.containerElement.style.removeProperty('--comp-pop-opacity');\n }\n\n async determinePopDirection() {\n const { containerElement, controlElement, providedDirection, displayBuffer } = this;\n if (containerElement) containerElement.style.maxHeight = null;\n\n await waitForNextPaint();\n\n const { isModule } = this;\n const { top: controlTop, bottom: controlBottom } = controlElement?.getBoundingClientRect?.() ?? {\n top: 0,\n bottom: 0,\n };\n\n let windowHeight: number;\n let maxSpaceAbove: number;\n let maxSpaceBelow: number;\n\n if (isModule) {\n const { outletOffset = 0, innerHeight = window.innerHeight } = window.Tecton?.platformDimensions || {};\n const distanceToIframeBottom = window.visualViewport.height - controlBottom;\n const viewableSpaceBelow = innerHeight - (outletOffset + controlBottom);\n const isIframeShorterThanWindow = distanceToIframeBottom < viewableSpaceBelow;\n windowHeight = innerHeight;\n // If the top of the module is below the top of the window we just use the controlTop\n // Otherwise we need to add the outletOffset to the controlTop\n maxSpaceAbove = (outletOffset > 0 ? controlTop : controlTop + outletOffset) - displayBuffer;\n maxSpaceBelow = isIframeShorterThanWindow\n ? distanceToIframeBottom - displayBuffer\n : viewableSpaceBelow - displayBuffer;\n } else {\n windowHeight = window.visualViewport.height;\n maxSpaceAbove = controlTop - displayBuffer;\n maxSpaceBelow = windowHeight - controlBottom - displayBuffer;\n }\n\n const directionWithMostSpace: 'up' | 'down' = maxSpaceAbove > maxSpaceBelow ? 'up' : 'down';\n\n // We do not want to update the max height once the popover is open unless the page orientation shifts (resize or mobile use cases)\n const shouldUpdateMaxHeight =\n !containerElement.style.getPropertyValue('--comp-pop-max-height') || this.orientationChanged;\n // we do not want to constantly update the max-height after an orientation change, so we switch this back to false\n this.orientationChanged = false;\n const currentOrDetermineDirection = this.currentDirection || providedDirection || directionWithMostSpace;\n\n switch (currentOrDetermineDirection) {\n case 'up':\n if (shouldUpdateMaxHeight) {\n const priorityMaxHeight = this.validatedMaxHeight || maxSpaceAbove;\n const maxHeight = Math.min(maxSpaceAbove, priorityMaxHeight);\n containerElement.style.setProperty('--comp-pop-max-height', `${maxHeight}px`);\n }\n this.setDirectionAndShow('up');\n break;\n case 'down':\n if (shouldUpdateMaxHeight) {\n const priorityMaxHeight = this.validatedMaxHeight || maxSpaceBelow;\n const maxHeight = Math.min(maxSpaceBelow, priorityMaxHeight);\n containerElement.style.setProperty('--comp-pop-max-height', `${maxHeight}px`);\n }\n this.setDirectionAndShow('down');\n break;\n default:\n break;\n }\n }\n\n handleMinHeight = () => {\n if (this.minHeight) {\n handleDeprecationWarning(this, 'minHeight', 'prop');\n }\n };\n\n handlePopoverToggleEvent = (event: ToggleEvent) => {\n this.popoverStateChanged.emit({ open: event.newState === 'open' });\n };\n\n removeViewportListeners() {\n window.removeEventListener('resize', this.viewPortOrientationChanged);\n visualViewport?.removeEventListener('resize', this.viewPortChanged);\n window.removeEventListener('scroll', this.viewPortChanged, { capture: true });\n screen?.orientation?.removeEventListener('orientationchange', this.viewPortOrientationChanged);\n window.removeEventListener('orientationchange', this.viewPortOrientationChanged);\n }\n\n setAbsoluteCSSProperties = async () => {\n const { controlElement, containerElement, currentDirection, align } = this;\n\n if (align === 'right') {\n containerElement.style.setProperty('--comp-pop-right', '0');\n containerElement.style.setProperty('--comp-pop-left', 'unset');\n } else {\n containerElement.style.setProperty('--comp-pop-left', '0');\n containerElement.style.setProperty('--comp-pop-right', 'unset');\n }\n\n if (this.block) {\n containerElement.style.setProperty('--comp-pop-width', '100%');\n }\n\n if (currentDirection === 'up') {\n const controlStyle = getComputedStyle(controlElement);\n const controlSize =\n parseInt(controlStyle.height || '0') +\n parseInt(controlStyle.borderTopWidth || '0') +\n parseInt(controlStyle.borderBottomWidth || '0');\n\n containerElement.style.setProperty('--comp-pop-bottom', `${controlSize}px`);\n }\n\n // Wait for one paint to prevent layout thrashing\n await waitForNextPaint();\n containerElement.style.setProperty('--comp-pop-opacity', '1');\n };\n\n setDirectionAndShow(direction: 'up' | 'down') {\n // Due to some runtime inconsistency across devices/browsers we need to add one more check here because the\n // popover can be closed between the time the popover is opened and the time the direction is determined\n const isOpen = this.open;\n if (!isOpen) return;\n\n this.currentDirection = direction;\n if (this.mode === 'legacy' || !this.supportsPopoverAPI) {\n this.show = true;\n this.setAbsoluteCSSProperties();\n } else {\n this.setPopoverAPICSSProperties();\n this.containerElement.showPopover();\n }\n }\n\n setPopoverAPICSSProperties = async () => {\n const { controlElement, containerElement, currentDirection, isModule, align } = this;\n const {\n top: controlTop,\n bottom: controlBottom,\n left: controlLeft,\n right: controlRight,\n } = controlElement?.getBoundingClientRect?.() ?? {\n top: 0,\n bottom: 0,\n left: 0,\n right: 0,\n };\n\n const popoverLeft: number = controlLeft;\n const popoverRight: number = window?.visualViewport?.width - controlRight;\n\n if (align === 'right') {\n containerElement.style.setProperty('--comp-pop-right', `${popoverRight - window.scrollX}px`);\n containerElement.style.setProperty('--comp-pop-left', 'unset');\n } else {\n containerElement.style.setProperty('--comp-pop-left', `${popoverLeft + window.scrollX}px`);\n containerElement.style.setProperty('--comp-pop-right', 'unset');\n }\n\n if (this.block) containerElement.style.setProperty('--comp-pop-width', `${controlElement?.offsetWidth || 0}px`);\n\n if (currentDirection === 'up') {\n if (isModule) {\n containerElement.style.setProperty('--comp-pop-bottom', `${window.innerHeight - controlTop}px`);\n } else {\n containerElement.style.setProperty(\n '--comp-pop-bottom',\n `${window.innerHeight - controlTop - window?.visualViewport?.offsetTop - window.scrollY}px`\n );\n }\n }\n\n if (currentDirection === 'down') {\n if (isModule) {\n containerElement.style.setProperty('--comp-pop-top', `${controlBottom}px`);\n } else {\n containerElement.style.setProperty(\n '--comp-pop-top',\n `${controlBottom + (window?.visualViewport?.offsetTop ?? 0) + window.scrollY}px`\n );\n }\n }\n\n // Wait for one paint to prevent layout thrashing\n await waitForNextPaint();\n containerElement.style.setProperty('--comp-pop-opacity', '1');\n };\n\n viewPortChanged = () => {\n if (!this.open) return;\n this.determinePopDirection();\n };\n\n viewPortOrientationChanged = () => {\n this.orientationChanged = true;\n this.viewPortChanged();\n };\n\n // #endregion\n // #region Render Methods\n\n render() {\n const containerClasses = ['container', this.currentDirection, this.align];\n if (this.show) containerClasses.push('show');\n if (this.block) containerClasses.push('block');\n if (this.mode === 'legacy') containerClasses.push('legacy');\n\n return (\n <div\n ref={el => (this.containerElement = el)}\n class={containerClasses.join(' ')}\n test-id=\"outerContainer\"\n tabIndex={-1}\n popover=\"auto\"\n >\n <div\n ref={el => (this.contentElement = el)}\n class=\"content\"\n >\n <slot />\n </div>\n </div>\n );\n }\n\n // #endregion\n}\n"]}
1
+ {"version":3,"file":"q2-popover.js","sourceRoot":"","sources":["../../../../src/components/q2-popover/q2-popover.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n Prop,\n h,\n ComponentInterface,\n Element,\n Watch,\n Method,\n Listen,\n EventEmitter,\n Event,\n State,\n} from '@stencil/core';\nimport { handleDeprecationWarning, waitForNextPaint, isMobile, isInScrollableContainer } from '../../utils';\n\n/**\n * ***********\n * * WARNING *\n * ***********\n * Touching this file obligates you to manually test thoroughly, because Puppeteer can't capture every edgecase.\n *\n * Each of the following Scenarios must be tested on each Device, in each Environment.\n *\n * Scenarios:\n * - Q2 Select non-typeable\n * - Q2 Select typeable\n *\n * Devices:\n * - iOS Safari\n * - Android Chrome\n * - MacOS Safari\n * - Chrome\n * - Firefox\n *\n * Environments:\n * - Standard (Outside of Iframe)\n * - SDK Extension (Inside of Iframe)\n */\n\n@Component({ tag: 'q2-popover', shadow: true, styleUrl: 'q2-popover.scss' })\nexport class Q2Popover implements ComponentInterface {\n // #region Own Properties\n\n containerElement: HTMLDivElement;\n contentElement: HTMLDivElement;\n /**\n * The number of pixels to leave between the popover and the edge of the viewport\n */\n displayBuffer = 10;\n orientationChanged: boolean = false;\n\n // #endregion\n // #region Host HTML Element\n\n @Element()\n hostElement: HTMLElement;\n\n // #endregion\n // #region State Properties\n\n @State()\n currentDirection: 'down' | 'up' = undefined;\n\n // remove `show` when Popover API is supported in iOS\n @State()\n show: boolean = false;\n\n // #endregion\n // #region Public Property API\n\n /** Aligns the popover to the left or right side of the control element. */\n @Prop({ reflect: true })\n align: 'left' | 'right' = 'left';\n\n /** Indicates the popover will match the width of its parent element. */\n @Prop({ reflect: true })\n block: boolean;\n\n /** The element that controls the popover's behavior. */\n @Prop()\n controlElement: HTMLElement;\n\n /**\n * Force the direction of the popover when it opens.\n * If no value is passed, the component will auto-detect the direction based on available space.\n */\n @Prop({ reflect: true })\n direction: 'up' | 'down';\n\n /**\n * Force the maximum height of the popover. This value will be interpreted as pixels.\n * If no value is passed, or the value exceeds available space, the component will auto-detect the maximum height based on available space.\n */\n @Prop()\n maxHeight: number;\n\n /** @deprecated */\n @Prop()\n minHeight: number;\n\n @Prop()\n mode: 'legacy' = null;\n\n /** Controls whether the popover is open or closed. */\n @Prop({ reflect: true, mutable: true })\n open: boolean;\n\n // #endregion\n // #region Events\n\n /**\n * Emitted when the popover is opened or closed.\n */\n @Event()\n popoverStateChanged: EventEmitter<{ open: boolean }>;\n\n // #endregion\n // #region Component Lifecycle Events\n\n disconnectedCallback() {\n this.removeViewportListeners();\n this.containerElement.removeEventListener('toggle', this.handlePopoverToggleEvent);\n this.containerElement = null;\n this.contentElement = null;\n this.controlElement = null;\n }\n\n componentWillLoad() {\n if (!this.supportsPopoverAPI) {\n console.warn(\n 'The Popover API is not supported in this browser. Please update your browser to the latest version. The component will use legacy mode.'\n );\n this.mode = 'legacy';\n }\n }\n\n componentDidLoad() {\n this.handleMinHeight();\n if (this.supportsPopoverAPI) this.containerElement.addEventListener('toggle', this.handlePopoverToggleEvent);\n if (this.open) this.determinePopDirection();\n }\n\n // #endregion\n // #region Listeners\n\n @Listen('popoverState')\n popoverStateHandler(event: CustomEvent<{ open: boolean }>) {\n const {\n detail: { open },\n } = event;\n if (open === this.open) return;\n\n this.open = open;\n event.stopPropagation();\n }\n\n // #endregion\n // #region Public Methods API\n\n @Method()\n async scrollContainerTo(options: ScrollToOptions) {\n this.containerElement.scrollTo(options);\n }\n\n @Method()\n async toggle() {\n this.open = !this.open;\n }\n\n // #endregion\n // #region Watchers\n\n @Watch('minHeight')\n minHeightProvided() {\n this.handleMinHeight();\n }\n\n @Watch('open')\n async openChanged(open: boolean) {\n this.popoverStateChanged.emit({ open });\n\n if (open) {\n this.addViewportListeners();\n this.determinePopDirection();\n } else {\n this.removeViewportListeners();\n this.currentDirection = undefined;\n if (this.mode === 'legacy' || !this.supportsPopoverAPI) {\n this.show = false;\n } else {\n this.containerElement.hidePopover();\n }\n\n await waitForNextPaint();\n this.clearCSSProperties();\n }\n }\n\n // #endregion\n // #region Local Methods\n\n get isModule() {\n const isIframe = window !== window.top;\n const hasPlatformDimensions = Object.keys(window.Tecton?.platformDimensions ?? {}).length > 0;\n return isIframe && hasPlatformDimensions;\n }\n\n get providedDirection(): 'up' | 'down' | undefined {\n const { direction } = this;\n switch (direction) {\n case 'up':\n case 'down':\n return direction;\n default:\n return undefined;\n }\n }\n\n get supportsPopoverAPI(): boolean {\n return Object.hasOwn(HTMLElement.prototype, 'popover');\n }\n\n get validatedMaxHeight(): number | undefined {\n const { maxHeight } = this;\n return isNaN(maxHeight) ? undefined : maxHeight;\n }\n\n addViewportListeners() {\n window.addEventListener('resize', this.viewPortOrientationChanged);\n visualViewport?.addEventListener('resize', this.viewPortChanged);\n if (isInScrollableContainer(this.hostElement) && !isMobile()) {\n window.addEventListener('scroll', this.viewPortChanged, { passive: true, capture: true });\n }\n screen?.orientation?.addEventListener('orientationchange', this.viewPortOrientationChanged);\n window.addEventListener('orientationchange', this.viewPortOrientationChanged);\n }\n\n clearCSSProperties() {\n this.containerElement.style.removeProperty('--comp-pop-max-height');\n this.containerElement.style.removeProperty('--comp-pop-top');\n this.containerElement.style.removeProperty('--comp-pop-bottom');\n this.containerElement.style.removeProperty('--comp-pop-left');\n this.containerElement.style.removeProperty('--comp-pop-right');\n this.containerElement.style.removeProperty('--comp-pop-width');\n this.containerElement.style.removeProperty('--comp-pop-opacity');\n }\n\n async determinePopDirection() {\n const { containerElement, controlElement, providedDirection, displayBuffer } = this;\n if (containerElement) containerElement.style.maxHeight = null;\n await waitForNextPaint();\n\n const { isModule } = this;\n const { top: controlTop, bottom: controlBottom } = controlElement?.getBoundingClientRect?.() ?? {\n top: 0,\n bottom: 0,\n };\n\n let windowHeight: number;\n let maxSpaceAbove: number;\n let maxSpaceBelow: number;\n if (isModule) {\n const {\n outletOffset = 0,\n innerHeight = window.innerHeight,\n top: topBarHeight = 0,\n bottom: bottomBarHeight = 0,\n } = window.Tecton?.platformDimensions || {};\n\n const distanceToIframeBottom = window.innerHeight - controlBottom;\n\n // controlElement position visually on the page\n const visualControlTop = outletOffset > 0 ? controlTop : controlTop + outletOffset - topBarHeight;\n const visualControlBottom = outletOffset + controlBottom - topBarHeight;\n\n // visual space around the controlElement\n const viewableSpaceAbove = visualControlTop;\n const viewableSpaceBelow = innerHeight - bottomBarHeight - visualControlBottom;\n\n // calculate space above and below controlElement\n const isIframeShorterThanWindow = distanceToIframeBottom < viewableSpaceBelow;\n maxSpaceAbove = viewableSpaceAbove - displayBuffer;\n maxSpaceBelow = isIframeShorterThanWindow\n ? distanceToIframeBottom - displayBuffer\n : viewableSpaceBelow - displayBuffer;\n } else {\n windowHeight = window.innerHeight;\n maxSpaceAbove = controlTop - displayBuffer;\n maxSpaceBelow = windowHeight - controlBottom - displayBuffer;\n }\n\n const directionWithMostSpace: 'up' | 'down' = maxSpaceAbove > maxSpaceBelow ? 'up' : 'down';\n\n // We do not want to update the max height once the popover is open unless the page orientation shifts (resize or mobile use cases)\n const shouldUpdateMaxHeight =\n !containerElement.style.getPropertyValue('--comp-pop-max-height') || this.orientationChanged;\n // we do not want to constantly update the max-height after an orientation change, so we switch this back to false\n this.orientationChanged = false;\n const currentOrDetermineDirection = this.currentDirection || providedDirection || directionWithMostSpace;\n\n switch (currentOrDetermineDirection) {\n case 'up':\n if (shouldUpdateMaxHeight) {\n const priorityMaxHeight = this.validatedMaxHeight || maxSpaceAbove;\n const maxHeight = Math.min(maxSpaceAbove, priorityMaxHeight);\n containerElement.style.setProperty('--comp-pop-max-height', `${maxHeight}px`);\n }\n this.setDirectionAndShow('up');\n break;\n case 'down':\n if (shouldUpdateMaxHeight) {\n const priorityMaxHeight = this.validatedMaxHeight || maxSpaceBelow;\n const maxHeight = Math.min(maxSpaceBelow, priorityMaxHeight);\n containerElement.style.setProperty('--comp-pop-max-height', `${maxHeight}px`);\n }\n this.setDirectionAndShow('down');\n break;\n default:\n break;\n }\n }\n\n handleMinHeight = () => {\n if (this.minHeight) {\n handleDeprecationWarning(this, 'minHeight', 'prop');\n }\n };\n\n handlePopoverToggleEvent = (event: ToggleEvent) => {\n this.popoverStateChanged.emit({ open: event.newState === 'open' });\n };\n\n removeViewportListeners() {\n window.removeEventListener('resize', this.viewPortOrientationChanged);\n visualViewport?.removeEventListener('resize', this.viewPortChanged);\n window.removeEventListener('scroll', this.viewPortChanged, { capture: true });\n screen?.orientation?.removeEventListener('orientationchange', this.viewPortOrientationChanged);\n window.removeEventListener('orientationchange', this.viewPortOrientationChanged);\n }\n\n setAbsoluteCSSProperties = async () => {\n const { controlElement, containerElement, currentDirection, align } = this;\n\n if (align === 'right') {\n containerElement.style.setProperty('--comp-pop-right', '0');\n containerElement.style.setProperty('--comp-pop-left', 'unset');\n } else {\n containerElement.style.setProperty('--comp-pop-left', '0');\n containerElement.style.setProperty('--comp-pop-right', 'unset');\n }\n\n if (this.block) {\n containerElement.style.setProperty('--comp-pop-width', '100%');\n }\n\n if (currentDirection === 'up') {\n const controlStyle = getComputedStyle(controlElement);\n const controlSize =\n parseInt(controlStyle.height || '0') +\n parseInt(controlStyle.borderTopWidth || '0') +\n parseInt(controlStyle.borderBottomWidth || '0');\n\n containerElement.style.setProperty('--comp-pop-bottom', `${controlSize}px`);\n }\n\n // Wait for one paint to prevent layout thrashing\n await waitForNextPaint();\n containerElement.style.setProperty('--comp-pop-opacity', '1');\n };\n\n setDirectionAndShow(direction: 'up' | 'down') {\n // Due to some runtime inconsistency across devices/browsers we need to add one more check here because the\n // popover can be closed between the time the popover is opened and the time the direction is determined\n const isOpen = this.open;\n if (!isOpen) return;\n\n this.currentDirection = direction;\n if (this.mode === 'legacy' || !this.supportsPopoverAPI) {\n this.show = true;\n this.setAbsoluteCSSProperties();\n } else {\n this.setPopoverAPICSSProperties();\n this.containerElement.showPopover();\n }\n }\n\n setPopoverAPICSSProperties = async () => {\n const { controlElement, containerElement, currentDirection, isModule, align } = this;\n const {\n top: controlTop,\n bottom: controlBottom,\n left: controlLeft,\n right: controlRight,\n } = controlElement?.getBoundingClientRect?.() ?? {\n top: 0,\n bottom: 0,\n left: 0,\n right: 0,\n };\n\n const popoverLeft: number = controlLeft;\n const popoverRight: number = window?.visualViewport?.width - controlRight;\n\n if (align === 'right') {\n containerElement.style.setProperty('--comp-pop-right', `${popoverRight - window.scrollX}px`);\n containerElement.style.setProperty('--comp-pop-left', 'unset');\n } else {\n containerElement.style.setProperty('--comp-pop-left', `${popoverLeft + window.scrollX}px`);\n containerElement.style.setProperty('--comp-pop-right', 'unset');\n }\n\n if (this.block) containerElement.style.setProperty('--comp-pop-width', `${controlElement?.offsetWidth || 0}px`);\n\n if (currentDirection === 'up') {\n if (isModule) {\n containerElement.style.setProperty('--comp-pop-bottom', `${window.innerHeight - controlTop}px`);\n } else {\n containerElement.style.setProperty(\n '--comp-pop-bottom',\n `${window.innerHeight - controlTop - window.scrollY}px`\n );\n }\n }\n\n if (currentDirection === 'down') {\n if (isModule) {\n containerElement.style.setProperty('--comp-pop-top', `${controlBottom}px`);\n } else {\n containerElement.style.setProperty('--comp-pop-top', `${controlBottom + window.scrollY}px`);\n }\n }\n\n // Wait for one paint to prevent layout thrashing\n await waitForNextPaint();\n containerElement.style.setProperty('--comp-pop-opacity', '1');\n };\n\n viewPortChanged = () => {\n if (!this.open) return;\n this.determinePopDirection();\n };\n\n viewPortOrientationChanged = () => {\n this.orientationChanged = true;\n this.viewPortChanged();\n };\n\n // #endregion\n // #region Render Methods\n\n render() {\n const containerClasses = ['container', this.currentDirection, this.align];\n if (this.show) containerClasses.push('show');\n if (this.block) containerClasses.push('block');\n if (this.mode === 'legacy') containerClasses.push('legacy');\n\n return (\n <div\n ref={el => (this.containerElement = el)}\n class={containerClasses.join(' ')}\n test-id=\"outerContainer\"\n tabIndex={-1}\n popover=\"manual\"\n >\n <div\n ref={el => (this.contentElement = el)}\n class=\"content\"\n >\n <slot />\n </div>\n </div>\n );\n }\n\n // #endregion\n}\n"]}