q2-tecton-elements 1.53.3 → 1.53.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/click-elsewhere_2.cjs.entry.js +1 -1
- package/dist/cjs/{index-7aecfed8.js → index-eec39d23.js} +36 -1
- package/dist/cjs/index-eec39d23.js.map +1 -0
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/q2-action-group.cjs.entry.js +1 -1
- package/dist/cjs/q2-action-sheet.cjs.entry.js +1 -1
- package/dist/cjs/q2-badge_7.cjs.entry.js +1 -1
- package/dist/cjs/q2-calendar.cjs.entry.js +1 -1
- package/dist/cjs/q2-card.cjs.entry.js +1 -1
- package/dist/cjs/q2-carousel-pane.cjs.entry.js +1 -1
- package/dist/cjs/q2-carousel.cjs.entry.js +1 -1
- package/dist/cjs/q2-chart-area.cjs.entry.js +1 -1
- package/dist/cjs/q2-chart-bar.cjs.entry.js +1 -1
- package/dist/cjs/q2-chart-donut.cjs.entry.js +1 -1
- package/dist/cjs/q2-checkbox-group.cjs.entry.js +1 -1
- package/dist/cjs/q2-checkbox.cjs.entry.js +1 -1
- package/dist/cjs/q2-data-table.cjs.entry.js +1 -1
- package/dist/cjs/q2-detail.cjs.entry.js +1 -1
- package/dist/cjs/q2-dropdown-item.cjs.entry.js +1 -1
- package/dist/cjs/q2-dropdown.cjs.entry.js +1 -1
- package/dist/cjs/q2-editable-field.cjs.entry.js +1 -1
- package/dist/cjs/q2-file-picker.cjs.entry.js +1 -1
- package/dist/cjs/q2-item_3.cjs.entry.js +1 -1
- package/dist/cjs/q2-loc.cjs.entry.js +1 -1
- package/dist/cjs/q2-message.cjs.entry.js +1 -1
- package/dist/cjs/q2-month-picker.cjs.entry.js +1 -1
- package/dist/cjs/q2-optgroup.cjs.entry.js +1 -1
- package/dist/cjs/q2-option-list.cjs.entry.js +1 -1
- package/dist/cjs/q2-option.cjs.entry.js +1 -1
- package/dist/cjs/q2-pagination.cjs.entry.js +1 -1
- package/dist/cjs/q2-pill.cjs.entry.js +1 -1
- package/dist/cjs/q2-radio-group.cjs.entry.js +1 -1
- package/dist/cjs/q2-radio.cjs.entry.js +1 -1
- package/dist/cjs/q2-relative-time.cjs.entry.js +1 -1
- package/dist/cjs/q2-section.cjs.entry.js +1 -1
- package/dist/cjs/q2-select.cjs.entry.js +13 -5
- package/dist/cjs/q2-select.cjs.entry.js.map +1 -1
- package/dist/cjs/q2-stepper-pane.cjs.entry.js +1 -1
- package/dist/cjs/q2-stepper-vertical.cjs.entry.js +1 -1
- package/dist/cjs/q2-stepper.cjs.entry.js +1 -1
- package/dist/cjs/q2-tag.cjs.entry.js +1 -1
- package/dist/cjs/q2-tecton-elements.cjs.js +1 -1
- package/dist/cjs/q2-textarea.cjs.entry.js +1 -1
- package/dist/cjs/q2-tooltip.cjs.entry.js +1 -1
- package/dist/collection/components/q2-select/q2-select.js +19 -5
- package/dist/collection/components/q2-select/q2-select.js.map +1 -1
- package/dist/collection/components/q2-select/test/q2-select-test.spec.js +8 -8
- package/dist/collection/components/q2-select/test/q2-select-test.spec.js.map +1 -1
- package/dist/collection/utils/index.js +34 -0
- package/dist/collection/utils/index.js.map +1 -1
- package/dist/components/index2.js +35 -1
- package/dist/components/index2.js.map +1 -1
- package/dist/components/q2-select2.js +14 -6
- package/dist/components/q2-select2.js.map +1 -1
- package/dist/esm/click-elsewhere_2.entry.js +1 -1
- package/dist/esm/{index-99c46474.js → index-52ca69b4.js} +36 -2
- package/dist/esm/index-52ca69b4.js.map +1 -0
- package/dist/esm/loader.js +1 -1
- package/dist/esm/q2-action-group.entry.js +1 -1
- package/dist/esm/q2-action-sheet.entry.js +1 -1
- package/dist/esm/q2-badge_7.entry.js +1 -1
- package/dist/esm/q2-calendar.entry.js +1 -1
- package/dist/esm/q2-card.entry.js +1 -1
- package/dist/esm/q2-carousel-pane.entry.js +1 -1
- package/dist/esm/q2-carousel.entry.js +1 -1
- package/dist/esm/q2-chart-area.entry.js +1 -1
- package/dist/esm/q2-chart-bar.entry.js +1 -1
- package/dist/esm/q2-chart-donut.entry.js +1 -1
- package/dist/esm/q2-checkbox-group.entry.js +1 -1
- package/dist/esm/q2-checkbox.entry.js +1 -1
- package/dist/esm/q2-data-table.entry.js +1 -1
- package/dist/esm/q2-detail.entry.js +1 -1
- package/dist/esm/q2-dropdown-item.entry.js +1 -1
- package/dist/esm/q2-dropdown.entry.js +1 -1
- package/dist/esm/q2-editable-field.entry.js +1 -1
- package/dist/esm/q2-file-picker.entry.js +1 -1
- package/dist/esm/q2-item_3.entry.js +1 -1
- package/dist/esm/q2-loc.entry.js +1 -1
- package/dist/esm/q2-message.entry.js +1 -1
- package/dist/esm/q2-month-picker.entry.js +1 -1
- package/dist/esm/q2-optgroup.entry.js +1 -1
- package/dist/esm/q2-option-list.entry.js +1 -1
- package/dist/esm/q2-option.entry.js +1 -1
- package/dist/esm/q2-pagination.entry.js +1 -1
- package/dist/esm/q2-pill.entry.js +1 -1
- package/dist/esm/q2-radio-group.entry.js +1 -1
- package/dist/esm/q2-radio.entry.js +1 -1
- package/dist/esm/q2-relative-time.entry.js +1 -1
- package/dist/esm/q2-section.entry.js +1 -1
- package/dist/esm/q2-select.entry.js +13 -5
- package/dist/esm/q2-select.entry.js.map +1 -1
- package/dist/esm/q2-stepper-pane.entry.js +1 -1
- package/dist/esm/q2-stepper-vertical.entry.js +1 -1
- package/dist/esm/q2-stepper.entry.js +1 -1
- package/dist/esm/q2-tag.entry.js +1 -1
- package/dist/esm/q2-tecton-elements.js +1 -1
- package/dist/esm/q2-textarea.entry.js +1 -1
- package/dist/esm/q2-tooltip.entry.js +1 -1
- package/dist/q2-tecton-elements/click-elsewhere_2.entry.js +1 -1
- package/dist/q2-tecton-elements/{index-99c46474.js → index-52ca69b4.js} +50 -15
- package/dist/q2-tecton-elements/index-52ca69b4.js.map +1 -0
- package/dist/q2-tecton-elements/q2-action-group.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-action-sheet.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-badge_7.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-calendar.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-card.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-carousel-pane.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-carousel.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-chart-area.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-chart-bar.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-chart-donut.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-checkbox-group.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-checkbox.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-data-table.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-detail.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-dropdown-item.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-dropdown.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-editable-field.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-file-picker.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-item_3.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-loc.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-message.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-month-picker.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-optgroup.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-option-list.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-option.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-pagination.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-pill.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-radio-group.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-radio.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-relative-time.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-section.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-select.entry.js +25 -17
- package/dist/q2-tecton-elements/q2-select.entry.js.map +1 -1
- package/dist/q2-tecton-elements/q2-stepper-pane.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-stepper-vertical.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-stepper.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-tag.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-tecton-elements.esm.js +1 -1
- package/dist/q2-tecton-elements/q2-tecton-elements.esm.js.map +1 -1
- package/dist/q2-tecton-elements/q2-textarea.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-tooltip.entry.js +1 -1
- package/dist/types/components/q2-select/q2-select.d.ts +7 -1
- package/dist/types/utils/index.d.ts +4 -0
- package/package.json +3 -3
- package/dist/cjs/index-7aecfed8.js.map +0 -1
- package/dist/esm/index-99c46474.js.map +0 -1
- package/dist/q2-tecton-elements/index-99c46474.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["q2SelectCss","Q2SelectStyle0","Q2Select","this","guid","createGuid","lastTouchWasInPopover","scheduledAfterRender","addTouchEventListeners","isMobile","popoverElement","addEventListener","handleTouchStart","passive","clickedElsewhere","event","target","localName","stopPropagation","open","innerInputField","blur","destroyEventListeners","_a","screen","orientation","removeEventListener","handleOrientationChange","window","visualViewport","removeTouchEventListeners","isLandscape","isModule","Tecton","platformDimensions","orientationType","includes","_c","_b","type","searchable","originalSearchable","document","activeElement","hostElement","inputFocused","focus","initEventListeners","initMutationObserver","observer","MutationObserver","onMutationObserved","observe","childList","subtree","mutationObserver","inputBlurHandler","inputChangeHandler","inputClickHandler","async","focusInput","shouldShowActionSheet","executeActionSheet","toggleDropdown","inputFocusHandler","inputInputHandler","eventValue","detail","value","shouldClearValue","clearValue","openDropdownWithoutActiveElement","prioritizeSearch","searchText","input","emit","query","inputKeydownHandler","readonly","disabled","key","shiftKey","isShiftTab","hasSlot","hasPopoverTop","hasPopoverBottom","keysForOptionListToHandle","inputField","preventDefault","shouldClearSearchText","clearSearchText","handleOptionListExternalKeydown","onCustomDisplayClick","slotContainer","querySelector","displaySlot","shadowRoot","hasCustomDisplay","assignedNodes","length","children","popTopSlot","topSlotHasNode","popBottomSlot","bottomSlotHasNode","checkSelectedOptions","onOptionListChange","values","showAllOptions","handleSelectionChanges","onPopoverState","action","optionList","setActiveElement","showSelected","showSelectedOptions","visibilityToggleKeyDown","isRadioControlKey","setDefaultActiveElement","useActionSheets","loc","disconnectedCallback","disconnect","componentWillLoad","handleAriaLabel","buildStructuredSelectedOptions","handleMultilineOptionsUpdate","multilineOptions","componentDidLoad","overrideFocus","setTimeout","checkSelectedDisplay","setCustomLabel","componentDidRender","forEach","fn","onHostElementChange","onchange","multiple","selectedOptions","onClearHandler","handleSelectedDisplay","display","delegateFocus","fromHost","isRelatedTargetWithinHost","clearSelectedDisplay","isEventFromElement","handleFocusout","relatedTarget","isLeavingHost","contains","closeDropdown","onHostElementInput","oninput","options","optionElements","trim","toLocaleLowerCase","matchedCount","option","hidden","title","firstElementChild","tagName","innerText","searchParams","matched","some","text","statusMessageLocString","count","setStatusMessage","keydownHandler","popoverStateChanged","closePopover","_togglePopover","openPopover","searchOptions","dispatchEvent","FocusEvent","InputEvent","setValue","valuesSet","Set","Array","isArray","waitForNextPaint","find","click","ariaLabelObserver","newValue","oldValue","element","multiline","openChanged","isOpen","push","popoverTopContainer","height","offsetHeight","style","setProperty","removeProperty","structuredSelectedOptions","map","valueUpdated","badgeValue","optionsLength","firstSelectedOptionElement","firstSelectedValue","innerInputContainer","inputId","isIframe","top","hasPlatformDimensions","Object","keys","from","querySelectorAll","popoverMinHeight","minRows","firstOption","minHeight","getComputedStyle","parseInt","selectedDisplay","calculateMultiSelectSelectedDisplay","calculateSingleSelectSelectedDisplay","selectedDisplaySlot","wrapperClasses","errors","classes","join","textContent","namedSlot","hasNoValue","selectionClone","cloneNode","remove","clientHeight","outerHTML","replaceChild","createElement","slot","appendChild","checkSelectedDisplayHeight","selected","change","undefined","result","showActionSheetList","handleExternalKeydown","changeDetails","selectedOptionValues","customLabel","removeChild","message","clearTimeout","statusMessageTimer","statusMessage","renderCustomDisplay","hasSelectedDisplay","h","name","renderOptionsDropdown","ref","el","controlElement","popoverMaxHeight","direction","popDirection","mode","popoverMode","block","class","id","label","listLabel","onChange","tabindex","renderVisibilityToggle","renderSelectField","Fragment","role","clearable","error","invalid","optional","placeholder","hideLabel","ariaExpanded","ariaControls","ariaHaspopup","iconRight","onClick","onInput","onKeyDown","onFocus","onBlur","badgeTheme","_role","_preventEntry","selectedOptionsCount","checked","htmlFor","render"],"sources":["src/components/q2-select/q2-select.scss?tag=q2-select&encapsulation=shadow","src/components/q2-select/q2-select.tsx"],"sourcesContent":["@import '../../styles/host.scss';\n@import '../../styles/functions';\n@import '../../styles/dropdowns';\n\n:host {\n --comp-select-margin: #{var-list(\n --tct-select-margin,\n unquote(\n '#{var-list(var-prefixer(select-margin-top), --app-scale-4, 30px)} 0 #{var-list(var-prefixer(select-margin-bottom), --app-scale-4, 30px)}'\n )\n )};\n display: block;\n margin: var(--comp-select-margin);\n}\n\n.q2-select-container {\n position: relative;\n display: block;\n}\n\n.q2-select-input {\n margin: 0;\n\n --tct-input-min-height: #{var-list(var-prefixer(select-input-min-height))};\n --tct-input-max-height: #{var-list(var-prefixer(select-input-max-height), none)};\n}\n\n::slotted([slot='_selected-display']) {\n width: 100%;\n min-height: var(--comp-selected-display-height, 44px);\n}\n\n.custom-display-content {\n position: absolute;\n bottom: 0;\n left: calc(var-list(--tct-scale-2, --app-scale-2x, 10px) + 1px);\n height: 44px;\n width: calc(100% - 34px - var-list(--tct-scale-3, --app-scale-3x, 15px));\n overflow: hidden;\n cursor: pointer;\n transition: left var-list(--tct-tween-2, --app-tween-1, unquote('0.2s ease'));\n}\n\n.custom-display-content:not([hidden]) {\n display: flex;\n align-items: center;\n}\n\n.is-searchable.is-focused .custom-display-content,\n.is-searchable .custom-display-content:active {\n left: calc(var-list(--tct-scale-3, --app-scale-3x, 15px) + 1px);\n}\n\n.has-error .custom-display-content {\n width: calc(100% - 68px - var-list(--tct-scale-3, --app-scale-3x, 15px));\n}\n\n.popover-content {\n display: flex;\n flex-direction: column-reverse;\n}\n\n.popover-bottom-container {\n position: sticky;\n bottom: 0;\n z-index: 5;\n}\n\n.popover-top-container {\n position: sticky;\n top: 0;\n z-index: 5;\n .multi-select-header {\n padding: var(--tct-scale-2, var(--app-scale-2x, 10px)) var(--tct-scale-2, var(--app-scale-2x, 10px));\n background: var(--app-white);\n display: flex;\n gap: var-list(--app-scale-2x, 10px);\n align-items: center;\n\n fieldset {\n margin: 0;\n padding: 0;\n border: 0;\n display: flex;\n gap: var-list(--app-scale-2x, 10px);\n }\n\n legend {\n padding: 0;\n float: left;\n }\n\n label {\n cursor: pointer;\n padding: var-list(\n var-prefixer(select-multi-select-option-padding),\n var-prefixer(btn-badge-padding),\n unquote('2px 5px')\n );\n font-size: var-list(\n var-prefixer(select-multi-select-option-font-size),\n var-prefixer(btn-badge-font-size),\n inherit\n );\n border-radius: var-list(\n var-prefixer(select-multi-select-option-radius),\n var-prefixer(btn-badge-border-radius),\n --app-border-radius-1,\n 4px\n );\n background: var-list(\n --tct-select-multi-select-option-background,\n var-prefixer(select-multi-select-option-bg),\n --tct-badge-background,\n var-prefixer(btn-badge-bg),\n transparent\n );\n color: var-list(\n var-prefixer(select-multi-select-option-color),\n var-prefixer(btn-badge-font-color),\n inherit\n );\n\n &:hover {\n background: var-list(\n --tct-select-multi-select-option-hover-background,\n var-prefixer(select-multi-select-option-hover-background-color),\n var-prefixer(btn-badge-hover-bg),\n var-prefixer(gray-14),\n --app-gray-l3,\n #f2f2f2\n );\n color: var-list(\n --tct-select-multi-select-option-hover-color,\n var-prefixer(select-multi-select-option-color),\n var-prefixer(btn-badge-hover-font-color),\n var-prefixer(gray-5),\n --app-gray-d2,\n #404040\n );\n }\n }\n\n input {\n &:checked + label {\n &,\n &:enabled:hover {\n background: var-list(\n --tct-select-multi-select-option-active-background,\n var-prefixer(select-multi-select-option-active-background-color),\n var-prefixer(btn-primary-bg),\n #2e2e2e\n );\n color: var-list(\n var-prefixer(select-multi-select-option-active-color),\n var-prefixer(btn-primary-font-color),\n --app-white,\n #ffffff\n );\n }\n }\n\n &:disabled + label {\n opacity: var-list(\n var-prefixer(select-multi-select-option-disabled-opacity),\n var-prefixer(btn-disabled-opacity),\n --app-disabled-opacity,\n 0.4\n );\n cursor: not-allowed;\n }\n\n &:focus + label {\n box-shadow: var(--const-double-focus-ring);\n }\n }\n }\n}\n","import {\n Component,\n Prop,\n Element,\n h,\n Listen,\n State,\n EventEmitter,\n Event,\n ComponentInterface,\n Watch,\n Method,\n Fragment,\n} from '@stencil/core';\nimport { IEventDetail, Q2InputCustomEvent, Q2OptionListCustomEvent } from 'src/components';\nimport {\n createGuid,\n handleAriaLabel,\n isEventFromElement,\n isMobile,\n isRelatedTargetWithinHost,\n loc,\n overrideFocus,\n waitForNextPaint,\n} from '../../utils';\nimport { IOptionValue } from '../q2-option-list/q2-option-list';\nimport { shouldShowActionSheet, showActionSheetList } from 'src/utils/action-sheet';\n\n/**\n * @slot popover-top - An optional slot to display custom content persistently at the top of the popover. This is **not** compatible with the action sheet workflow.\n * @slot popover-bottom - An optional slot to display custom content persistently at the bottom of the popover. This is **not** compatible with the action sheet workflow.\n * @slot q2-select-display - An optional slot to display custom HTML content in the display area.\n */\n@Component({ tag: 'q2-select', shadow: true, styleUrl: 'q2-select.scss' })\nexport class Q2Select implements ComponentInterface {\n // #region Own Properties\n\n guid = createGuid();\n inputField?: HTMLQ2InputElement;\n lastTouchWasInPopover: boolean = false;\n mutationObserver: MutationObserver;\n optionList: HTMLQ2OptionListElement;\n originalSearchable: boolean;\n popoverElement?: HTMLQ2PopoverElement;\n popoverTopContainer?: HTMLDivElement;\n scheduledAfterRender: (() => void)[] = [];\n statusMessageTimer: NodeJS.Timeout;\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 hasCustomDisplay: boolean = false;\n\n @State()\n hasPopoverBottom: boolean = false;\n\n @State()\n hasPopoverTop: boolean = false;\n\n @State()\n inputFocused: boolean = false;\n\n @State()\n open: boolean = false;\n\n @State()\n prioritizeSearch: boolean = false;\n\n @State()\n searchText: string = '';\n\n @State()\n showSelected: boolean = false;\n\n @State()\n statusMessage: string;\n\n @State()\n structuredSelectedOptions: IOptionValue[] = [];\n\n // #endregion\n // #region Public Property API\n\n /** @deprecated */\n @Prop({ reflect: true, mutable: true })\n ariaLabel: string;\n\n /** Renders an icon button when the field is non-empty. Pressing the button clears all input from the field. */\n @Prop({ reflect: true })\n clearable: boolean;\n\n /** Disables all interaction with the field and leverages the disabled visual style of `q2-input`. */\n @Prop({ reflect: true })\n disabled: boolean = false;\n\n /**\n * The presence of `errors` will mark the field as invalid, putting it into an error state.\n * @localizable\n */\n @Prop()\n errors: string[];\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 * @warning\n * If your `q2-select` renders inside of an iframe, and you are using multiline/robust content options,\n * any custom CSS you apply to your options will not get passed up to the platform which displays the action sheet.\n * For this reason, we strongly suggest using the [q2-card](https://tecton.q2developer.com/design-system/q2-card/) component since its styling is managed by Tecton.\n */\n @Prop()\n hoist: boolean = !!window.Tecton?.useActionSheets;\n\n /** Determines whether to show an error state. Its primary use-case is for an unfilled field. */\n @Prop({ reflect: true })\n invalid: boolean;\n\n /**\n * The text that will be used as the label for the field.\n * @localizable\n */\n @Prop({ reflect: true, mutable: true })\n label: string;\n\n /**\n * Determines the label that is applied to the option list for accessibility purposes.\n * @localizable\n */\n @Prop()\n listLabel: string = loc('tecton.element.select.listLabel');\n\n /** The minimum number of rows the component will try to display below or above the component when opened. */\n @Prop()\n minRows: number = 3;\n\n /** Enables text wrapping for `q2-option` elements. When `false`, the text truncates and does not wrap. */\n @Prop({ reflect: true })\n multilineOptions: boolean = false;\n\n /** Enables multi-select functionality. */\n @Prop({ reflect: true })\n multiple: boolean = false;\n\n /** Appends \"(optional)\" to the field label, and sets `aria-required` on the nested input tag to `false`. */\n @Prop({ reflect: true })\n optional: boolean = false;\n\n /**\n * Text that appears within the field when it is blurred and empty.\n * Placeholder text disappears when the user selects an option.\n * @localizable\n */\n @Prop({ reflect: true })\n placeholder: string;\n\n /** @deprecated */\n @Prop({ reflect: true })\n popDirection: '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 /**\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 * Appends \"(read only)\" to the field label, and field becomes unusable, but remains focusable.\n * Takes priority over `optional` if both are `true`.\n */\n @Prop({ reflect: true })\n readonly: boolean = false;\n\n /** Enables search functionality. */\n @Prop({ reflect: true, mutable: true })\n searchable: boolean = false;\n\n /**\n * Each item in this array should correspond to the value of a `q2-option` element.\n * This property is only relevant for `multiple` (i.e., multi-select) implementations.\n */\n @Prop({ mutable: true })\n selectedOptions: string[] = [];\n\n /**\n * The current value for the select. This should correspond to the value of a nested q2-option element.\n * This property is only relevant for single-select implementations.\n */\n @Prop({ mutable: true })\n value: string;\n\n // #endregion\n // #region Events\n\n /**\n * Emitted when an option is selected or deselected.\n *\n * When the multi-select is enabled, the `value` property will be `undefined` and the `selectedOptions` property\n * will contain the selected option values.\n *\n * @legacyEvent\n */\n @Event()\n change: EventEmitter<{ value: string; selectedOptions: string[] }>;\n\n /**\n * Emitted when the input value changes.\n *\n * Requires the `searchable` prop to be set to `true`.\n */\n @Event()\n input: EventEmitter<{ query: string }>;\n\n // #endregion\n // #region Component Lifecycle Events\n\n disconnectedCallback() {\n this.mutationObserver?.disconnect();\n this.mutationObserver = null;\n this.destroyEventListeners();\n }\n\n componentWillLoad() {\n this.originalSearchable = this.searchable;\n handleAriaLabel(this);\n this.handleOrientationChange();\n this.buildStructuredSelectedOptions();\n this.handleMultilineOptionsUpdate(this.multilineOptions, false);\n }\n\n componentDidLoad() {\n this.initMutationObserver();\n this.initEventListeners();\n overrideFocus(this.hostElement);\n setTimeout(() => this.checkSelectedDisplay(), 0);\n this.setCustomLabel();\n }\n\n componentDidRender() {\n setTimeout(() => {\n this.scheduledAfterRender.forEach(fn => fn());\n this.scheduledAfterRender = [];\n }, 25);\n }\n\n // #endregion\n // #region Listeners\n\n @Listen('change')\n onHostElementChange(event: CustomEvent<{ value: string; selectedOptions: string[] }>) {\n if (this.readonly || this.disabled) return;\n if (event.target !== this.hostElement || this.hostElement.onchange) return;\n if (this.multiple) {\n this.value = null;\n this.selectedOptions = event.detail.selectedOptions;\n } else {\n this.value = event.detail.value;\n this.selectedOptions = [];\n }\n }\n\n @Listen('clear')\n onClearHandler() {\n this.clearValue();\n }\n\n @Listen('displayChanged')\n handleSelectedDisplay(event: CustomEvent) {\n if (this.multiple) return;\n this.inputField.value = event.detail.display;\n }\n\n @Listen('focus')\n delegateFocus(event: FocusEvent) {\n const fromHost = isRelatedTargetWithinHost(event, this.hostElement);\n const prioritizeSearch = (this.prioritizeSearch = fromHost && this.searchable);\n if (prioritizeSearch) {\n this.clearSelectedDisplay();\n } else if (isEventFromElement(event, this.hostElement)) {\n this.innerInputField.focus();\n }\n }\n\n @Listen('focusout')\n handleFocusout(event: FocusEvent) {\n const relatedTarget = event.relatedTarget as HTMLElement;\n const isLeavingHost =\n !this.popoverElement?.contains(relatedTarget) && !this.hostElement.contains(relatedTarget);\n if (isLeavingHost) this.closeDropdown();\n this.prioritizeSearch = !isLeavingHost && this.searchable;\n }\n\n @Listen('input')\n onHostElementInput(event: CustomEvent) {\n if (!this.searchable || event.target !== this.hostElement || this.hostElement.oninput) return;\n const options = this.optionElements;\n const query = this.searchText.trim().toLocaleLowerCase();\n let matchedCount = 0;\n options.forEach(option => {\n if (query === '') {\n option.hidden = false;\n return;\n }\n\n const title =\n option.firstElementChild?.tagName === 'Q2-CARD'\n ? (option.firstElementChild as HTMLQ2CardElement).title\n : null;\n const { display = '', innerText = '' } = option;\n const searchParams = [display, title, innerText];\n const matched = searchParams.some(text => text?.toLocaleLowerCase().includes(query) ?? false);\n\n option.hidden = !matched;\n if (matched) matchedCount++;\n });\n\n const statusMessageLocString = query\n ? 'tecton.element.select.searchable.results'\n : 'tecton.element.select.allOptions';\n const count = query ? matchedCount : options.length;\n this.setStatusMessage(loc(statusMessageLocString, [count]));\n }\n\n @Listen('keydown')\n keydownHandler(event: KeyboardEvent) {\n this.inputKeydownHandler(event);\n }\n\n @Listen('popoverStateChanged')\n popoverStateChanged({ detail: { open } }: CustomEvent<{ open: boolean }>) {\n if (this.open !== open) this.open = open;\n }\n\n // #endregion\n // #region Public Methods API\n\n /**\n * Emulates clicking the `<input>` to hide the popover if it is visible.\n *\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 `<input>` to display the popover if it is hidden.\n *\n * @testOnly\n */\n @Method()\n async openPopover() {\n if (this.open || this.disabled) return;\n this._togglePopover();\n }\n\n /**\n * Emulates focusing the `<input>`, entering the provided value, and emitting an `input` event.\n *\n * @warning\n * Only applicable when the input is searchable.\n *\n * @testOnly\n */\n @Method()\n searchOptions(query: string) {\n if (!this.searchable) return;\n\n const { innerInputField } = this;\n innerInputField.focus();\n innerInputField.dispatchEvent(new FocusEvent('focus'));\n innerInputField.value = query;\n innerInputField.dispatchEvent(new InputEvent('input'));\n }\n\n /**\n * Emulates clicking the `<input>` to display the popover and selecting the option(s) with the specified value(s).\n *\n * If the multi-select is enabled and the `closePopover` argument is `true` (default), the popover will be closed\n * after the option(s) are selected.\n *\n * @testOnly\n */\n @Method()\n async setValue(values: string | string[], options: { closePopover?: boolean } = { closePopover: true }) {\n const valuesSet = new Set(Array.isArray(values) ? values : [values]);\n if (!this.open) {\n await this.openPopover();\n await waitForNextPaint();\n }\n\n valuesSet.forEach(value => {\n this.optionElements.find(option => option.value === value)?.click();\n });\n\n if (options.closePopover) {\n await this.closePopover();\n await waitForNextPaint();\n }\n }\n\n // #endregion\n // #region Watchers\n\n @Watch('ariaLabel')\n ariaLabelObserver() {\n handleAriaLabel(this);\n }\n\n @Watch('multilineOptions')\n handleMultilineOptionsUpdate(newValue, oldValue) {\n if (newValue === oldValue) return;\n this.optionElements.forEach(element => (element.multiline = newValue));\n }\n\n @Watch('open')\n openChanged(isOpen: boolean) {\n if (isOpen) {\n this.addTouchEventListeners();\n } else {\n this.removeTouchEventListeners();\n }\n this.scheduledAfterRender.push(async () => {\n await waitForNextPaint();\n const { popoverTopContainer, popoverElement } = this;\n const height = (isOpen && popoverTopContainer?.offsetHeight) || 0;\n if (height) {\n popoverElement.style.setProperty('--comp-popover-top-container-height', `${height}px`);\n } else {\n popoverElement.style.removeProperty('--comp-popover-top-container-height');\n }\n });\n }\n\n @Watch('value')\n @Watch('selectedOptions')\n buildStructuredSelectedOptions() {\n const { multiple, selectedOptions, value } = this;\n if (multiple) {\n this.structuredSelectedOptions = !!selectedOptions?.length\n ? selectedOptions.map(option => (typeof option === 'string' ? { value: option } : option))\n : [];\n } else {\n this.structuredSelectedOptions = value ? [{ value }] : [];\n }\n }\n\n @Watch('value')\n valueUpdated() {\n if (this.multiple) return;\n this.clearSearchText();\n }\n\n // #endregion\n // #region Local Methods\n\n get badgeValue(): string {\n if (!this.multiple) return null;\n const optionsLength = this.selectedOptions?.length ?? 0;\n if (this.open && this.searchable) return optionsLength ? `${optionsLength}` : null;\n else return optionsLength > 1 ? `+${optionsLength - 1}` : null;\n }\n\n get firstSelectedOptionElement() {\n const { firstSelectedValue } = this;\n return firstSelectedValue ? this.optionElements.find(({ value }) => value === firstSelectedValue) : null;\n }\n\n get firstSelectedValue() {\n return this.multiple ? this.selectedOptions?.[0] : this.value;\n }\n\n get innerInputContainer(): HTMLElement {\n return this.inputField?.shadowRoot?.querySelector('.input-container');\n }\n\n get innerInputField(): HTMLInputElement | HTMLButtonElement {\n return this.inputField?.shadowRoot?.querySelector('.input-field');\n }\n\n get inputId() {\n return `select-guid-${this.guid}`;\n }\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 optionElements() {\n return Array.from(this.hostElement.querySelectorAll<HTMLQ2OptionElement>('q2-option'));\n }\n\n get popoverMinHeight() {\n const { minRows } = this;\n const firstOption = this.hostElement.querySelector<HTMLQ2OptionElement>('q2-option:not([hidden])');\n let minHeight = firstOption && window.getComputedStyle(firstOption).minHeight;\n\n // Safari doesn't return a min-height for non-visible items\n if (!minHeight || minHeight === '0px') minHeight = '44px';\n\n return minRows * parseInt(minHeight);\n }\n\n get selectedDisplay() {\n if (this.prioritizeSearch || this.searchText) return this.searchText;\n if (this.hasCustomDisplay) return '';\n return this.multiple ? this.calculateMultiSelectSelectedDisplay() : this.calculateSingleSelectSelectedDisplay();\n }\n\n get selectedDisplaySlot() {\n return this.hostElement.querySelector<HTMLElement>('[slot=\"_selected-display\"]');\n }\n\n get wrapperClasses() {\n const { errors } = this;\n const classes = ['q2-select-container'];\n if (Array.isArray(errors) && errors.length > 0) classes.push('has-error');\n if (this.inputFocused) classes.push('is-focused');\n if (this.searchable) classes.push('is-searchable');\n return classes.join(' ');\n }\n\n _togglePopover() {\n const { innerInputField } = this;\n innerInputField?.click();\n innerInputField?.focus();\n innerInputField.dispatchEvent(new FocusEvent('focus'));\n }\n\n addTouchEventListeners = () => {\n if (!isMobile() || !this.popoverElement) return;\n\n this.popoverElement.addEventListener('touchstart', this.handleTouchStart, { passive: true });\n };\n\n calculateMultiSelectSelectedDisplay() {\n const { firstSelectedOptionElement, firstSelectedValue, multilineOptions } = this;\n if (!firstSelectedValue) return '';\n if (firstSelectedOptionElement?.display) return loc(firstSelectedOptionElement.display);\n if (multilineOptions && this.searchable) return this.searchText;\n if (multilineOptions) return '';\n return (\n firstSelectedOptionElement?.textContent?.trim() ?? firstSelectedOptionElement?.value ?? firstSelectedValue\n );\n }\n\n calculateSingleSelectSelectedDisplay() {\n const { firstSelectedOptionElement, multilineOptions } = this;\n if (multilineOptions) {\n return (firstSelectedOptionElement?.display && loc(firstSelectedOptionElement.display)) || this.value || '';\n } else {\n return (\n (firstSelectedOptionElement?.display && loc(firstSelectedOptionElement.display)) ||\n firstSelectedOptionElement?.textContent?.trim() ||\n this.value ||\n ''\n );\n }\n }\n\n checkSelectedDisplay() {\n // This prevents an undefined property error when the spec tests are run\n try {\n this.hostElement;\n } catch (error) {\n return null;\n }\n let namedSlot = this.selectedDisplaySlot;\n const { value, multiple, selectedOptions, multilineOptions, firstSelectedOptionElement, prioritizeSearch } =\n this;\n const hasNoValue = !value && multiple && !selectedOptions?.length;\n if (prioritizeSearch || !multilineOptions || hasNoValue) return this.clearSelectedDisplay();\n\n if (!firstSelectedOptionElement || firstSelectedOptionElement.display) return this.clearSelectedDisplay();\n\n // Clone selected option and remove elements with hide-on-select attribute\n const selectionClone = firstSelectedOptionElement.firstElementChild.cloneNode(true) as HTMLElement;\n selectionClone.querySelectorAll('[hide-on-select]').forEach(element => element.remove());\n\n if (namedSlot) {\n const height = namedSlot.clientHeight === 0 ? 'auto' : `${namedSlot.clientHeight}px`;\n namedSlot.style.setProperty('--comp-selected-display-height', height);\n if (namedSlot.firstElementChild.outerHTML !== selectionClone.outerHTML) {\n namedSlot.replaceChild(selectionClone, namedSlot.firstElementChild);\n }\n } else {\n namedSlot = document.createElement('div');\n namedSlot.slot = '_selected-display';\n namedSlot.appendChild(selectionClone);\n this.hostElement.appendChild(namedSlot);\n }\n return namedSlot;\n }\n\n checkSelectedDisplayHeight() {\n const { selectedDisplaySlot } = this;\n if (!selectedDisplaySlot) return;\n selectedDisplaySlot.style.setProperty('--comp-selected-display-height', '44px');\n }\n\n checkSelectedOptions() {\n const { multiple, selectedOptions, value } = this;\n this.optionElements.forEach(option => {\n if (multiple) {\n option.selected = selectedOptions.includes(option.value);\n } else {\n option.selected = option.value === value;\n }\n });\n }\n\n clearSearchText() {\n if (!this.searchText) return;\n this.searchText = '';\n this.input.emit({ query: '' });\n }\n\n clearSelectedDisplay() {\n this.selectedDisplaySlot?.remove();\n }\n\n clearValue() {\n const { multiple } = this;\n this.value = '';\n this.selectedOptions = [];\n this.change.emit({ value: multiple ? undefined : '', selectedOptions: multiple ? [] : undefined });\n }\n\n clickedElsewhere = (event: CustomEvent) => {\n const target = event.target as HTMLClickElsewhereElement;\n if (target.localName !== 'click-elsewhere') return;\n event.stopPropagation();\n const { popoverElement } = this;\n if (!popoverElement) return;\n popoverElement.open = false;\n this.innerInputField.blur();\n };\n\n closeDropdown() {\n this.open = false;\n this.lastTouchWasInPopover = false;\n this.clearSearchText();\n }\n\n destroyEventListeners = () => {\n if (!isMobile()) return;\n screen?.orientation?.removeEventListener('change', this.handleOrientationChange);\n window.removeEventListener('resize', this.handleOrientationChange);\n visualViewport?.removeEventListener('resize', this.handleOrientationChange);\n this.removeTouchEventListeners();\n };\n\n async executeActionSheet(event: MouseEvent | KeyboardEvent) {\n const result = await showActionSheetList(this, event);\n this.focusInput();\n this.handleSelectionChanges(result);\n }\n\n focusInput() {\n this.inputField?.dispatchEvent(new FocusEvent('focus'));\n }\n\n // Helps with checking for calls to handleExternalKeydown in spec tests\n handleOptionListExternalKeydown(event: KeyboardEvent) {\n this.optionList.handleExternalKeydown(event);\n }\n\n handleOrientationChange = () => {\n if (!isMobile()) return;\n\n let isLandscape: boolean;\n if (this.isModule) {\n isLandscape = window.Tecton?.platformDimensions.orientationType.includes('landscape');\n } else {\n isLandscape = screen?.orientation?.type?.includes('landscape');\n }\n if (isLandscape && this.searchable) this.searchable = false;\n if (!isLandscape) this.searchable = this.originalSearchable;\n };\n\n handleSelectionChanges(changeDetails: { value?: string; values?: IOptionValue[] }) {\n const { value = '', values = [] } = changeDetails;\n const selectedOptionValues = values.map(value => value.value);\n const { multiple } = this;\n if (!this.hostElement.onchange) {\n this.selectedOptions = selectedOptionValues;\n }\n\n this.change.emit({\n value: multiple ? undefined : value,\n selectedOptions: multiple ? selectedOptionValues : undefined,\n });\n }\n\n handleTouchStart = (event: TouchEvent) => {\n if (document.activeElement === this.hostElement) {\n const target = event.target as HTMLElement;\n if (target && target !== this.hostElement) {\n this.inputFocused = false;\n this.lastTouchWasInPopover = true;\n target.focus();\n }\n }\n };\n\n initEventListeners = () => {\n if (!isMobile()) return;\n screen?.orientation?.addEventListener('change', this.handleOrientationChange);\n window.addEventListener('resize', this.handleOrientationChange);\n visualViewport?.addEventListener('resize', this.handleOrientationChange);\n };\n\n initMutationObserver = () => {\n const observer = new MutationObserver(this.onMutationObserved);\n observer.observe(this.hostElement, { childList: true, subtree: true });\n this.mutationObserver = observer;\n this.onMutationObserved();\n };\n\n inputBlurHandler = () => {\n this.inputFocused = false;\n };\n\n inputChangeHandler = (event: Event) => {\n event.stopPropagation();\n };\n\n inputClickHandler = async (event: MouseEvent) => {\n event.stopPropagation();\n\n // Check if the last interaction was a touch within the popover\n // If so, don't toggle the dropdown as the user is likely continuing to interact\n if (this.lastTouchWasInPopover && this.open && this.searchable) {\n // Reset the flag and don't toggle\n this.lastTouchWasInPopover = false;\n this.focusInput();\n return;\n }\n\n // Reset the flag for any other click\n this.lastTouchWasInPopover = false;\n\n if (shouldShowActionSheet(this)) {\n return this.executeActionSheet(event);\n }\n this.toggleDropdown();\n this.focusInput();\n };\n\n inputFocusHandler = () => {\n this.inputFocused = true;\n };\n\n inputInputHandler = (event: Q2InputCustomEvent<IEventDetail> & InputEvent) => {\n event.stopPropagation();\n const eventValue = event.detail.value;\n const shouldClearValue = !!this.value;\n\n if (shouldClearValue) this.clearValue();\n if (!this.open) this.openDropdownWithoutActiveElement();\n\n this.prioritizeSearch = true;\n this.searchText = eventValue;\n this.input.emit({ query: eventValue });\n };\n\n inputKeydownHandler = (event: KeyboardEvent) => {\n if (this.readonly || this.disabled) return;\n const { key, shiftKey } = event;\n const isShiftTab = key === 'Tab' && shiftKey;\n const hasSlot = this.hasPopoverTop || this.hasPopoverBottom;\n if (hasSlot && (key === 'Tab' || isShiftTab)) return;\n\n // slots are incompatible with action sheet\n if (shouldShowActionSheet(this, event) && !hasSlot) {\n return this.executeActionSheet(event);\n }\n\n const keysForOptionListToHandle = [\n 'ArrowDown',\n 'ArrowUp',\n 'PageDown',\n 'PageUp',\n 'Home',\n 'End',\n 'Escape',\n 'Tab',\n ];\n\n if (this.searchable && (key === ' ' || key === 'Enter') && this.inputField.value == '') {\n event.preventDefault();\n if (!this.open) this.openDropdownWithoutActiveElement();\n }\n\n if (this.searchable && !keysForOptionListToHandle.includes(key)) return;\n if (this.shouldClearSearchText(event)) this.clearSearchText();\n\n // Prevent click event from firing when spacebar is pressed\n if (key === ' ') event.preventDefault();\n\n this.handleOptionListExternalKeydown(event);\n };\n\n onCustomDisplayClick = (event: MouseEvent) => {\n event.stopPropagation();\n this.focusInput();\n this.toggleDropdown();\n };\n\n onMutationObserved = () => {\n const { hostElement, hasPopoverTop, hasPopoverBottom } = this;\n const slotContainer = hostElement.querySelector('.custom-display-content');\n const displaySlot = hostElement.shadowRoot.querySelector<HTMLSlotElement>('slot[name=\"q2-select-display\"]');\n const hasCustomDisplay = !!displaySlot\n ? displaySlot.assignedNodes().length > 0\n : slotContainer.children.length > 0;\n\n if (this.hasCustomDisplay !== hasCustomDisplay) {\n this.hasCustomDisplay = hasCustomDisplay;\n }\n\n const popTopSlot = hostElement.shadowRoot.querySelector<HTMLSlotElement>('slot[name=\"popover-top\"]');\n const topSlotHasNode = popTopSlot?.assignedNodes().length > 0;\n if (hasPopoverTop !== topSlotHasNode) {\n this.hasPopoverTop = topSlotHasNode;\n }\n\n const popBottomSlot = hostElement.shadowRoot.querySelector<HTMLSlotElement>('slot[name=\"popover-bottom\"]');\n const bottomSlotHasNode = popBottomSlot?.assignedNodes().length > 0;\n if (hasPopoverBottom !== bottomSlotHasNode) {\n this.hasPopoverBottom = bottomSlotHasNode;\n }\n\n this.checkSelectedOptions();\n };\n\n onOptionListChange = (event: Q2OptionListCustomEvent<{ value: string; values: IOptionValue[] }>) => {\n event.stopPropagation();\n const { values } = event.detail;\n\n if (values.length === 0) this.showAllOptions();\n this.handleSelectionChanges(event.detail);\n };\n\n onPopoverState = ({\n detail: { open, action },\n }: CustomEvent<{ open: boolean; action: 'close' | 'select' | 'open' }>) => {\n if (!open || this.searchText) {\n if (action !== 'select') {\n this.optionList.setActiveElement(null);\n }\n this.inputField.focus();\n }\n\n if (this.open === open) return;\n this.open = open;\n };\n\n openDropdownWithoutActiveElement() {\n if (this.readonly || this.disabled) return;\n this.optionList.setActiveElement(null);\n this.open = true;\n }\n\n removeTouchEventListeners = () => {\n if (!isMobile() || !this.popoverElement) return;\n\n this.popoverElement.removeEventListener('touchstart', this.handleTouchStart);\n };\n\n setCustomLabel() {\n const customLabel = this.hostElement.querySelector('[slot=\"label\"]');\n if (customLabel) {\n this.inputField?.appendChild(customLabel.cloneNode(true));\n this.hostElement.removeChild(customLabel);\n }\n }\n\n setStatusMessage(message) {\n clearTimeout(this.statusMessageTimer);\n this.statusMessage = '';\n this.statusMessageTimer = setTimeout(() => {\n this.statusMessage = message;\n }, 1000);\n }\n\n shouldClearSearchText(event: KeyboardEvent) {\n return this.searchable && !!this.searchText && event.key === 'Escape';\n }\n\n showAllOptions = () => {\n this.showSelected = false;\n };\n\n showSelectedOptions = () => {\n this.showSelected = true;\n };\n\n toggleDropdown() {\n if (this.readonly || this.disabled) return;\n\n if (this.open && !this.searchText) {\n this.closeDropdown();\n } else {\n this.openDropdownWithoutActiveElement();\n }\n }\n\n visibilityToggleKeyDown = (event: KeyboardEvent) => {\n const key = event.key;\n const isShiftTab = key === 'Tab' && event.shiftKey;\n const isRadioControlKey = ['ArrowLeft', 'ArrowRight', 'ArrowUp', 'ArrowDown'].includes(key);\n if (isRadioControlKey) event.stopPropagation();\n if (isShiftTab) {\n event.stopPropagation();\n // allows shift+tab keys to select the top slot when present\n if (this.hasPopoverTop) return;\n\n this.optionList.setDefaultActiveElement();\n }\n };\n\n // #endregion\n // #region Render Methods\n\n renderCustomDisplay() {\n const hasSelectedDisplay = this.checkSelectedDisplay();\n if (!hasSelectedDisplay) return;\n this.checkSelectedDisplayHeight();\n\n return (\n <slot\n name=\"_selected-display\"\n slot=\"custom-display\"\n />\n );\n }\n\n renderOptionsDropdown() {\n return (\n <q2-popover\n ref={el => (this.popoverElement = el)}\n controlElement={this.innerInputContainer}\n open={this.open}\n max-height={this.popoverMaxHeight}\n minHeight={this.popoverMinHeight}\n direction={this.popDirection}\n mode={this.popoverMode || undefined}\n block\n >\n <div class=\"popover-content\">\n <q2-option-list\n onPopoverState={this.onPopoverState}\n ref={el => (this.optionList = el)}\n type=\"listbox\"\n id=\"option-list\"\n show-selected={this.showSelected}\n label={this.listLabel}\n multiple={this.multiple}\n selectedOptions={this.structuredSelectedOptions}\n onChange={this.onOptionListChange}\n >\n <slot />\n </q2-option-list>\n <div\n class=\"popover-top-container\"\n ref={el => (this.popoverTopContainer = el)}\n hidden={!this.multiple && !this.hasPopoverTop}\n tabindex=\"-1\"\n >\n <slot name=\"popover-top\"></slot>\n {this.multiple && this.renderVisibilityToggle()}\n </div>\n </div>\n <div\n class=\"popover-bottom-container\"\n hidden={!this.hasPopoverBottom}\n tabindex=\"-1\"\n >\n <slot name=\"popover-bottom\" />\n </div>\n </q2-popover>\n );\n }\n\n renderSelectField() {\n return (\n <Fragment>\n <div\n aria-live=\"polite\"\n aria-atomic=\"true\"\n role=\"status\"\n class=\"sr\"\n >\n {this.statusMessage}\n </div>\n <q2-input\n ref={el => (this.inputField = el)}\n class=\"q2-select-input\"\n label={(this.label && loc(this.label)) || ''}\n value={this.selectedDisplay}\n clearable={(this.clearable && (!!this.value || !!this.selectedOptions?.length)) || undefined}\n errors={\n (Array.isArray(this.errors) &&\n this.errors.length > 0 &&\n this.errors.map(error => loc(error))) ||\n (this.invalid && ['tecton.element.select.invalid']) ||\n []\n }\n disabled={this.disabled}\n optional={this.optional}\n readonly={!!this.readonly}\n placeholder={this.placeholder || undefined}\n hideLabel={this.hideLabel}\n ariaExpanded={`${this.open}`}\n ariaControls=\"option-list\"\n ariaHaspopup=\"listbox\"\n test-id=\"toggleDropdown\"\n hide-messages\n iconRight=\"chevron-down\"\n onClick={this.inputClickHandler}\n onInput={this.inputInputHandler}\n onKeyDown={this.inputKeydownHandler}\n onFocus={this.inputFocusHandler}\n onBlur={this.inputBlurHandler}\n onChange={this.inputChangeHandler}\n badgeValue={this.badgeValue}\n badgeTheme={this.inputFocused ? 'primary' : undefined}\n _role=\"combobox\"\n _preventEntry={!this.searchable}\n >\n {this.renderCustomDisplay()}\n </q2-input>\n <div\n class=\"custom-display-content\"\n hidden={!this.hasCustomDisplay || !!this.searchText}\n onClick={this.onCustomDisplayClick}\n >\n <slot name=\"q2-select-display\" />\n </div>\n {this.renderOptionsDropdown()}\n </Fragment>\n );\n }\n\n renderVisibilityToggle() {\n const selectedOptionsCount = this.selectedOptions?.length ?? 0;\n const { showSelected } = this;\n return (\n <div class=\"multi-select-header\">\n <fieldset>\n <legend aria-label={loc('tecton.element.select.multiHeader.showing')}>\n {loc('tecton.element.select.multiHeader.showing')}\n </legend>\n <div>\n <input\n class=\"sr\"\n type=\"radio\"\n id=\"all\"\n name=\"viewDisplay\"\n value=\"all\"\n checked={!showSelected}\n aria-label={loc('tecton.element.select.multiHeader.allAriaLabel')}\n test-id=\"allOptionsButton\"\n onClick={this.showAllOptions}\n onKeyDown={this.visibilityToggleKeyDown}\n />\n <label htmlFor=\"all\">{loc('tecton.element.select.multiHeader.all')}</label>\n </div>\n\n <div>\n <input\n class=\"sr\"\n type=\"radio\"\n id=\"selected\"\n disabled={selectedOptionsCount === 0}\n name=\"viewDisplay\"\n value=\"selected\"\n aria-label={loc('tecton.element.select.multiHeader.selectedAriaLabel', [\n selectedOptionsCount,\n ])}\n checked={showSelected}\n test-id=\"selectedOptionsButton\"\n onClick={this.showSelectedOptions}\n onKeyDown={this.visibilityToggleKeyDown}\n />\n <label htmlFor=\"selected\">\n {loc('tecton.element.select.multiHeader.selected', [selectedOptionsCount])}\n </label>\n </div>\n </fieldset>\n </div>\n );\n }\n\n render() {\n return (\n <click-elsewhere\n class={this.wrapperClasses}\n onChange={this.clickedElsewhere}\n >\n {this.renderSelectField()}\n </click-elsewhere>\n );\n }\n\n // #endregion\n}\n\n// #endregion\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"names":["q2SelectCss","Q2SelectStyle0","Q2Select","this","guid","createGuid","lastTouchWasInPopover","scheduledAfterRender","addTouchEventListeners","isMobile","popoverElement","addEventListener","handleTouchMove","passive","clickedElsewhere","event","target","localName","stopPropagation","open","innerInputField","blur","destroyEventListeners","_a","screen","orientation","removeEventListener","handleOrientationChange","window","visualViewport","removeTouchEventListeners","isLandscape","isModule","Tecton","platformDimensions","orientationType","includes","_c","_b","type","searchable","originalSearchable","document","activeElement","hostElement","inputFocused","focus","initEventListeners","initMutationObserver","observer","MutationObserver","onMutationObserved","observe","childList","subtree","mutationObserver","inputBlurHandler","inputChangeHandler","inputClickHandler","async","focusInput","shouldShowActionSheet","executeActionSheet","toggleDropdown","inputFocusHandler","inputInputHandler","eventValue","detail","value","shouldClearValue","clearValue","openDropdownWithoutActiveElement","prioritizeSearch","searchText","input","emit","query","inputKeydownHandler","readonly","disabled","key","shiftKey","isShiftTab","hasSlot","hasPopoverTop","hasPopoverBottom","keysForOptionListToHandle","inputField","preventDefault","shouldClearSearchText","clearSearchText","handleOptionListExternalKeydown","onCustomDisplayClick","slotContainer","querySelector","displaySlot","shadowRoot","hasCustomDisplay","assignedNodes","length","children","popTopSlot","topSlotHasNode","popBottomSlot","bottomSlotHasNode","checkSelectedOptions","onOptionListChange","values","showAllOptions","handleSelectionChanges","onPopoverState","action","optionList","setActiveElement","showSelected","showSelectedOptions","visibilityToggleKeyDown","isRadioControlKey","setDefaultActiveElement","useActionSheets","loc","disconnectedCallback","disconnect","componentWillLoad","handleAriaLabel","buildStructuredSelectedOptions","handleMultilineOptionsUpdate","multilineOptions","componentDidLoad","overrideFocus","setTimeout","checkSelectedDisplay","setCustomLabel","componentDidRender","forEach","fn","onHostElementChange","onchange","multiple","selectedOptions","onClearHandler","handleSelectedDisplay","display","delegateFocus","fromHost","isRelatedTargetWithinHost","clearSelectedDisplay","isEventFromElement","handleFocusout","relatedTarget","isLeavingHost","contains","closeDropdown","onHostElementInput","oninput","options","optionElements","trim","toLocaleLowerCase","matchedCount","option","hidden","title","firstElementChild","tagName","innerText","searchParams","matched","some","text","statusMessageLocString","count","setStatusMessage","keydownHandler","popoverStateChanged","handleTctClick","name","version","getBrowserInfo","majorVersion","Number","split","isNaN","push","closePopover","_togglePopover","openPopover","searchOptions","dispatchEvent","FocusEvent","InputEvent","setValue","valuesSet","Set","Array","isArray","waitForNextPaint","find","click","ariaLabelObserver","newValue","oldValue","element","multiline","openChanged","isOpen","popoverTopContainer","height","offsetHeight","style","setProperty","removeProperty","structuredSelectedOptions","map","valueUpdated","badgeValue","optionsLength","firstSelectedOptionElement","firstSelectedValue","innerInputContainer","inputId","isIframe","top","hasPlatformDimensions","Object","keys","from","querySelectorAll","popoverMinHeight","minRows","firstOption","minHeight","getComputedStyle","parseInt","selectedDisplay","calculateMultiSelectSelectedDisplay","calculateSingleSelectSelectedDisplay","selectedDisplaySlot","wrapperClasses","errors","classes","join","textContent","namedSlot","hasNoValue","selectionClone","cloneNode","remove","clientHeight","outerHTML","replaceChild","createElement","slot","appendChild","checkSelectedDisplayHeight","selected","change","undefined","result","showActionSheetList","handleExternalKeydown","changeDetails","selectedOptionValues","customLabel","removeChild","message","clearTimeout","statusMessageTimer","statusMessage","renderCustomDisplay","hasSelectedDisplay","h","renderOptionsDropdown","ref","el","controlElement","popoverMaxHeight","direction","popDirection","mode","popoverMode","block","class","id","label","listLabel","onChange","tabindex","renderVisibilityToggle","renderSelectField","Fragment","role","clearable","error","invalid","optional","placeholder","hideLabel","ariaExpanded","ariaControls","ariaHaspopup","iconRight","onClick","onInput","onKeyDown","onFocus","onBlur","badgeTheme","_role","_preventEntry","selectedOptionsCount","checked","htmlFor","render"],"sources":["src/components/q2-select/q2-select.scss?tag=q2-select&encapsulation=shadow","src/components/q2-select/q2-select.tsx"],"sourcesContent":["@import '../../styles/host.scss';\n@import '../../styles/functions';\n@import '../../styles/dropdowns';\n\n:host {\n --comp-select-margin: #{var-list(\n --tct-select-margin,\n unquote(\n '#{var-list(var-prefixer(select-margin-top), --app-scale-4, 30px)} 0 #{var-list(var-prefixer(select-margin-bottom), --app-scale-4, 30px)}'\n )\n )};\n display: block;\n margin: var(--comp-select-margin);\n}\n\n.q2-select-container {\n position: relative;\n display: block;\n}\n\n.q2-select-input {\n margin: 0;\n\n --tct-input-min-height: #{var-list(var-prefixer(select-input-min-height))};\n --tct-input-max-height: #{var-list(var-prefixer(select-input-max-height), none)};\n}\n\n::slotted([slot='_selected-display']) {\n width: 100%;\n min-height: var(--comp-selected-display-height, 44px);\n}\n\n.custom-display-content {\n position: absolute;\n bottom: 0;\n left: calc(var-list(--tct-scale-2, --app-scale-2x, 10px) + 1px);\n height: 44px;\n width: calc(100% - 34px - var-list(--tct-scale-3, --app-scale-3x, 15px));\n overflow: hidden;\n cursor: pointer;\n transition: left var-list(--tct-tween-2, --app-tween-1, unquote('0.2s ease'));\n}\n\n.custom-display-content:not([hidden]) {\n display: flex;\n align-items: center;\n}\n\n.is-searchable.is-focused .custom-display-content,\n.is-searchable .custom-display-content:active {\n left: calc(var-list(--tct-scale-3, --app-scale-3x, 15px) + 1px);\n}\n\n.has-error .custom-display-content {\n width: calc(100% - 68px - var-list(--tct-scale-3, --app-scale-3x, 15px));\n}\n\n.popover-content {\n display: flex;\n flex-direction: column-reverse;\n}\n\n.popover-bottom-container {\n position: sticky;\n bottom: 0;\n z-index: 5;\n}\n\n.popover-top-container {\n position: sticky;\n top: 0;\n z-index: 5;\n .multi-select-header {\n padding: var(--tct-scale-2, var(--app-scale-2x, 10px)) var(--tct-scale-2, var(--app-scale-2x, 10px));\n background: var(--app-white);\n display: flex;\n gap: var-list(--app-scale-2x, 10px);\n align-items: center;\n\n fieldset {\n margin: 0;\n padding: 0;\n border: 0;\n display: flex;\n gap: var-list(--app-scale-2x, 10px);\n }\n\n legend {\n padding: 0;\n float: left;\n }\n\n label {\n cursor: pointer;\n padding: var-list(\n var-prefixer(select-multi-select-option-padding),\n var-prefixer(btn-badge-padding),\n unquote('2px 5px')\n );\n font-size: var-list(\n var-prefixer(select-multi-select-option-font-size),\n var-prefixer(btn-badge-font-size),\n inherit\n );\n border-radius: var-list(\n var-prefixer(select-multi-select-option-radius),\n var-prefixer(btn-badge-border-radius),\n --app-border-radius-1,\n 4px\n );\n background: var-list(\n --tct-select-multi-select-option-background,\n var-prefixer(select-multi-select-option-bg),\n --tct-badge-background,\n var-prefixer(btn-badge-bg),\n transparent\n );\n color: var-list(\n var-prefixer(select-multi-select-option-color),\n var-prefixer(btn-badge-font-color),\n inherit\n );\n\n &:hover {\n background: var-list(\n --tct-select-multi-select-option-hover-background,\n var-prefixer(select-multi-select-option-hover-background-color),\n var-prefixer(btn-badge-hover-bg),\n var-prefixer(gray-14),\n --app-gray-l3,\n #f2f2f2\n );\n color: var-list(\n --tct-select-multi-select-option-hover-color,\n var-prefixer(select-multi-select-option-color),\n var-prefixer(btn-badge-hover-font-color),\n var-prefixer(gray-5),\n --app-gray-d2,\n #404040\n );\n }\n }\n\n input {\n &:checked + label {\n &,\n &:enabled:hover {\n background: var-list(\n --tct-select-multi-select-option-active-background,\n var-prefixer(select-multi-select-option-active-background-color),\n var-prefixer(btn-primary-bg),\n #2e2e2e\n );\n color: var-list(\n var-prefixer(select-multi-select-option-active-color),\n var-prefixer(btn-primary-font-color),\n --app-white,\n #ffffff\n );\n }\n }\n\n &:disabled + label {\n opacity: var-list(\n var-prefixer(select-multi-select-option-disabled-opacity),\n var-prefixer(btn-disabled-opacity),\n --app-disabled-opacity,\n 0.4\n );\n cursor: not-allowed;\n }\n\n &:focus + label {\n box-shadow: var(--const-double-focus-ring);\n }\n }\n }\n}\n","import {\n Component,\n Prop,\n Element,\n h,\n Listen,\n State,\n EventEmitter,\n Event,\n ComponentInterface,\n Watch,\n Method,\n Fragment,\n} from '@stencil/core';\nimport { IEventDetail, Q2InputCustomEvent, Q2OptionListCustomEvent } from 'src/components';\nimport {\n createGuid,\n getBrowserInfo,\n handleAriaLabel,\n isEventFromElement,\n isMobile,\n isRelatedTargetWithinHost,\n loc,\n overrideFocus,\n waitForNextPaint,\n} from '../../utils';\nimport { IOptionValue } from '../q2-option-list/q2-option-list';\nimport { shouldShowActionSheet, showActionSheetList } from 'src/utils/action-sheet';\n\n/**\n * @slot popover-top - An optional slot to display custom content persistently at the top of the popover. This is **not** compatible with the action sheet workflow.\n * @slot popover-bottom - An optional slot to display custom content persistently at the bottom of the popover. This is **not** compatible with the action sheet workflow.\n * @slot q2-select-display - An optional slot to display custom HTML content in the display area.\n */\n@Component({ tag: 'q2-select', shadow: true, styleUrl: 'q2-select.scss' })\nexport class Q2Select implements ComponentInterface {\n // #region Own Properties\n\n guid = createGuid();\n inputField?: HTMLQ2InputElement;\n lastTouchWasInPopover: boolean = false;\n mutationObserver: MutationObserver;\n optionList: HTMLQ2OptionListElement;\n originalSearchable: boolean;\n popoverElement?: HTMLQ2PopoverElement;\n popoverTopContainer?: HTMLDivElement;\n scheduledAfterRender: (() => void)[] = [];\n statusMessageTimer: NodeJS.Timeout;\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 hasCustomDisplay: boolean = false;\n\n @State()\n hasPopoverBottom: boolean = false;\n\n @State()\n hasPopoverTop: boolean = false;\n\n @State()\n inputFocused: boolean = false;\n\n @State()\n open: boolean = false;\n\n /**\n * Determines what text to show in the input field.\n * When `true`, the component will display the search text in the input field\n * When `false`, the component will display the selected option(s) in the input field\n */\n @State()\n prioritizeSearch: boolean = false;\n\n @State()\n searchText: string = '';\n\n @State()\n showSelected: boolean = false;\n\n @State()\n statusMessage: string;\n\n @State()\n structuredSelectedOptions: IOptionValue[] = [];\n\n // #endregion\n // #region Public Property API\n\n /** @deprecated */\n @Prop({ reflect: true, mutable: true })\n ariaLabel: string;\n\n /** Renders an icon button when the field is non-empty. Pressing the button clears all input from the field. */\n @Prop({ reflect: true })\n clearable: boolean;\n\n /** Disables all interaction with the field and leverages the disabled visual style of `q2-input`. */\n @Prop({ reflect: true })\n disabled: boolean = false;\n\n /**\n * The presence of `errors` will mark the field as invalid, putting it into an error state.\n * @localizable\n */\n @Prop()\n errors: string[];\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 * @warning\n * If your `q2-select` renders inside of an iframe, and you are using multiline/robust content options,\n * any custom CSS you apply to your options will not get passed up to the platform which displays the action sheet.\n * For this reason, we strongly suggest using the [q2-card](https://tecton.q2developer.com/design-system/q2-card/) component since its styling is managed by Tecton.\n */\n @Prop()\n hoist: boolean = !!window.Tecton?.useActionSheets;\n\n /** Determines whether to show an error state. Its primary use-case is for an unfilled field. */\n @Prop({ reflect: true })\n invalid: boolean;\n\n /**\n * The text that will be used as the label for the field.\n * @localizable\n */\n @Prop({ reflect: true, mutable: true })\n label: string;\n\n /**\n * Determines the label that is applied to the option list for accessibility purposes.\n * @localizable\n */\n @Prop()\n listLabel: string = loc('tecton.element.select.listLabel');\n\n /** The minimum number of rows the component will try to display below or above the component when opened. */\n @Prop()\n minRows: number = 3;\n\n /** Enables text wrapping for `q2-option` elements. When `false`, the text truncates and does not wrap. */\n @Prop({ reflect: true })\n multilineOptions: boolean = false;\n\n /** Enables multi-select functionality. */\n @Prop({ reflect: true })\n multiple: boolean = false;\n\n /** Appends \"(optional)\" to the field label, and sets `aria-required` on the nested input tag to `false`. */\n @Prop({ reflect: true })\n optional: boolean = false;\n\n /**\n * Text that appears within the field when it is blurred and empty.\n * Placeholder text disappears when the user selects an option.\n * @localizable\n */\n @Prop({ reflect: true })\n placeholder: string;\n\n /** @deprecated */\n @Prop({ reflect: true })\n popDirection: '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 /**\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 * Appends \"(read only)\" to the field label, and field becomes unusable, but remains focusable.\n * Takes priority over `optional` if both are `true`.\n */\n @Prop({ reflect: true })\n readonly: boolean = false;\n\n /** Enables search functionality. */\n @Prop({ reflect: true, mutable: true })\n searchable: boolean = false;\n\n /**\n * Each item in this array should correspond to the value of a `q2-option` element.\n * This property is only relevant for `multiple` (i.e., multi-select) implementations.\n */\n @Prop({ mutable: true })\n selectedOptions: string[] = [];\n\n /**\n * The current value for the select. This should correspond to the value of a nested q2-option element.\n * This property is only relevant for single-select implementations.\n */\n @Prop({ mutable: true })\n value: string;\n\n // #endregion\n // #region Events\n\n /**\n * Emitted when an option is selected or deselected.\n *\n * When the multi-select is enabled, the `value` property will be `undefined` and the `selectedOptions` property\n * will contain the selected option values.\n *\n * @legacyEvent\n */\n @Event()\n change: EventEmitter<{ value: string; selectedOptions: string[] }>;\n\n /**\n * Emitted when the input value changes.\n *\n * Requires the `searchable` prop to be set to `true`.\n */\n @Event()\n input: EventEmitter<{ query: string }>;\n\n // #endregion\n // #region Component Lifecycle Events\n\n disconnectedCallback() {\n this.mutationObserver?.disconnect();\n this.mutationObserver = null;\n this.destroyEventListeners();\n }\n\n componentWillLoad() {\n this.originalSearchable = this.searchable;\n handleAriaLabel(this);\n this.handleOrientationChange();\n this.buildStructuredSelectedOptions();\n this.handleMultilineOptionsUpdate(this.multilineOptions, false);\n }\n\n componentDidLoad() {\n this.initMutationObserver();\n this.initEventListeners();\n overrideFocus(this.hostElement);\n setTimeout(() => this.checkSelectedDisplay(), 0);\n this.setCustomLabel();\n }\n\n componentDidRender() {\n setTimeout(() => {\n this.scheduledAfterRender.forEach(fn => fn());\n this.scheduledAfterRender = [];\n }, 25);\n }\n\n // #endregion\n // #region Listeners\n\n @Listen('change')\n onHostElementChange(event: CustomEvent<{ value: string; selectedOptions: string[] }>) {\n if (this.readonly || this.disabled) return;\n if (event.target !== this.hostElement || this.hostElement.onchange) return;\n if (this.multiple) {\n this.value = null;\n this.selectedOptions = event.detail.selectedOptions;\n } else {\n this.value = event.detail.value;\n this.selectedOptions = [];\n }\n }\n\n @Listen('clear')\n onClearHandler() {\n this.clearValue();\n }\n\n @Listen('displayChanged')\n handleSelectedDisplay(event: CustomEvent) {\n if (this.multiple) return;\n this.inputField.value = event.detail.display;\n }\n\n @Listen('focus')\n delegateFocus(event: FocusEvent) {\n const fromHost = isRelatedTargetWithinHost(event, this.hostElement);\n const prioritizeSearch = (this.prioritizeSearch = fromHost && this.searchable);\n if (prioritizeSearch) {\n this.clearSelectedDisplay();\n } else if (isEventFromElement(event, this.hostElement)) {\n this.innerInputField.focus();\n }\n }\n\n @Listen('focusout')\n handleFocusout(event: FocusEvent) {\n const relatedTarget = event.relatedTarget as HTMLElement;\n const isLeavingHost =\n !this.popoverElement?.contains(relatedTarget) && !this.hostElement.contains(relatedTarget);\n if (isLeavingHost) this.closeDropdown();\n this.prioritizeSearch = !isLeavingHost && this.searchable;\n }\n\n @Listen('input')\n onHostElementInput(event: CustomEvent) {\n if (!this.searchable || event.target !== this.hostElement || this.hostElement.oninput) return;\n const options = this.optionElements;\n const query = this.searchText.trim().toLocaleLowerCase();\n let matchedCount = 0;\n options.forEach(option => {\n if (query === '') {\n option.hidden = false;\n return;\n }\n\n const title =\n option.firstElementChild?.tagName === 'Q2-CARD'\n ? (option.firstElementChild as HTMLQ2CardElement).title\n : null;\n const { display = '', innerText = '' } = option;\n const searchParams = [display, title, innerText];\n const matched = searchParams.some(text => text?.toLocaleLowerCase().includes(query) ?? false);\n\n option.hidden = !matched;\n if (matched) matchedCount++;\n });\n\n const statusMessageLocString = query\n ? 'tecton.element.select.searchable.results'\n : 'tecton.element.select.allOptions';\n const count = query ? matchedCount : options.length;\n this.setStatusMessage(loc(statusMessageLocString, [count]));\n }\n\n @Listen('keydown')\n keydownHandler(event: KeyboardEvent) {\n this.inputKeydownHandler(event);\n }\n\n @Listen('popoverStateChanged')\n popoverStateChanged({ detail: { open } }: CustomEvent<{ open: boolean }>) {\n if (this.open !== open) this.open = open;\n }\n\n @Listen('tctClick')\n handleTctClick() {\n const { name, version } = getBrowserInfo();\n const majorVersion = Number(version.split('.')[0]);\n // Only Safari under iOS 18 having issue when searchable\n if (this.searchable && name === 'Safari' && !isNaN(majorVersion) && majorVersion < 18) {\n this.scheduledAfterRender.push(() => this.innerInputField.blur());\n }\n }\n\n // #endregion\n // #region Public Methods API\n\n /**\n * Emulates clicking the `<input>` to hide the popover if it is visible.\n *\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 `<input>` to display the popover if it is hidden.\n *\n * @testOnly\n */\n @Method()\n async openPopover() {\n if (this.open || this.disabled) return;\n this._togglePopover();\n }\n\n /**\n * Emulates focusing the `<input>`, entering the provided value, and emitting an `input` event.\n *\n * @warning\n * Only applicable when the input is searchable.\n *\n * @testOnly\n */\n @Method()\n searchOptions(query: string) {\n if (!this.searchable) return;\n\n const { innerInputField } = this;\n innerInputField.focus();\n innerInputField.dispatchEvent(new FocusEvent('focus'));\n innerInputField.value = query;\n innerInputField.dispatchEvent(new InputEvent('input'));\n }\n\n /**\n * Emulates clicking the `<input>` to display the popover and selecting the option(s) with the specified value(s).\n *\n * If the multi-select is enabled and the `closePopover` argument is `true` (default), the popover will be closed\n * after the option(s) are selected.\n *\n * @testOnly\n */\n @Method()\n async setValue(values: string | string[], options: { closePopover?: boolean } = { closePopover: true }) {\n const valuesSet = new Set(Array.isArray(values) ? values : [values]);\n if (!this.open) {\n await this.openPopover();\n await waitForNextPaint();\n }\n\n valuesSet.forEach(value => {\n this.optionElements.find(option => option.value === value)?.click();\n });\n\n if (options.closePopover) {\n await this.closePopover();\n await waitForNextPaint();\n }\n }\n\n // #endregion\n // #region Watchers\n\n @Watch('ariaLabel')\n ariaLabelObserver() {\n handleAriaLabel(this);\n }\n\n @Watch('multilineOptions')\n handleMultilineOptionsUpdate(newValue, oldValue) {\n if (newValue === oldValue) return;\n this.optionElements.forEach(element => (element.multiline = newValue));\n }\n\n @Watch('open')\n openChanged(isOpen: boolean) {\n if (isOpen) {\n this.addTouchEventListeners();\n } else {\n this.removeTouchEventListeners();\n }\n this.scheduledAfterRender.push(async () => {\n await waitForNextPaint();\n const { popoverTopContainer, popoverElement } = this;\n const height = (isOpen && popoverTopContainer?.offsetHeight) || 0;\n if (height) {\n popoverElement.style.setProperty('--comp-popover-top-container-height', `${height}px`);\n } else {\n popoverElement.style.removeProperty('--comp-popover-top-container-height');\n }\n });\n }\n\n @Watch('value')\n @Watch('selectedOptions')\n buildStructuredSelectedOptions() {\n const { multiple, selectedOptions, value } = this;\n if (multiple) {\n this.structuredSelectedOptions = !!selectedOptions?.length\n ? selectedOptions.map(option => (typeof option === 'string' ? { value: option } : option))\n : [];\n } else {\n this.structuredSelectedOptions = value ? [{ value }] : [];\n }\n }\n\n @Watch('value')\n valueUpdated() {\n if (this.multiple) return;\n this.clearSearchText();\n }\n\n // #endregion\n // #region Local Methods\n\n get badgeValue(): string {\n if (!this.multiple) return null;\n const optionsLength = this.selectedOptions?.length ?? 0;\n if (this.open && this.searchable) return optionsLength ? `${optionsLength}` : null;\n else return optionsLength > 1 ? `+${optionsLength - 1}` : null;\n }\n\n get firstSelectedOptionElement() {\n const { firstSelectedValue } = this;\n return firstSelectedValue ? this.optionElements.find(({ value }) => value === firstSelectedValue) : null;\n }\n\n get firstSelectedValue() {\n return this.multiple ? this.selectedOptions?.[0] : this.value;\n }\n\n get innerInputContainer(): HTMLElement {\n return this.inputField?.shadowRoot?.querySelector('.input-container');\n }\n\n get innerInputField(): HTMLInputElement | HTMLButtonElement {\n return this.inputField?.shadowRoot?.querySelector('.input-field');\n }\n\n get inputId() {\n return `select-guid-${this.guid}`;\n }\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 optionElements() {\n return Array.from(this.hostElement.querySelectorAll<HTMLQ2OptionElement>('q2-option'));\n }\n\n get popoverMinHeight() {\n const { minRows } = this;\n const firstOption = this.hostElement.querySelector<HTMLQ2OptionElement>('q2-option:not([hidden])');\n let minHeight = firstOption && window.getComputedStyle(firstOption).minHeight;\n\n // Safari doesn't return a min-height for non-visible items\n if (!minHeight || minHeight === '0px') minHeight = '44px';\n\n return minRows * parseInt(minHeight);\n }\n\n get selectedDisplay() {\n if (this.prioritizeSearch || this.searchText) return this.searchText;\n if (this.hasCustomDisplay) return '';\n return this.multiple ? this.calculateMultiSelectSelectedDisplay() : this.calculateSingleSelectSelectedDisplay();\n }\n\n get selectedDisplaySlot() {\n return this.hostElement.querySelector<HTMLElement>('[slot=\"_selected-display\"]');\n }\n\n get wrapperClasses() {\n const { errors } = this;\n const classes = ['q2-select-container'];\n if (Array.isArray(errors) && errors.length > 0) classes.push('has-error');\n if (this.inputFocused) classes.push('is-focused');\n if (this.searchable) classes.push('is-searchable');\n return classes.join(' ');\n }\n\n _togglePopover() {\n const { innerInputField } = this;\n innerInputField?.click();\n innerInputField?.focus();\n innerInputField.dispatchEvent(new FocusEvent('focus'));\n }\n\n addTouchEventListeners = () => {\n if (!isMobile() || !this.popoverElement) return;\n\n this.popoverElement.addEventListener('touchmove', this.handleTouchMove, { passive: true });\n };\n\n calculateMultiSelectSelectedDisplay() {\n const { firstSelectedOptionElement, firstSelectedValue, multilineOptions } = this;\n if (!firstSelectedValue) return '';\n if (firstSelectedOptionElement?.display) return loc(firstSelectedOptionElement.display);\n if (multilineOptions && this.searchable) return this.searchText;\n if (multilineOptions) return '';\n return (\n firstSelectedOptionElement?.textContent?.trim() ?? firstSelectedOptionElement?.value ?? firstSelectedValue\n );\n }\n\n calculateSingleSelectSelectedDisplay() {\n const { firstSelectedOptionElement, multilineOptions } = this;\n if (multilineOptions) {\n return (firstSelectedOptionElement?.display && loc(firstSelectedOptionElement.display)) || this.value || '';\n } else {\n return (\n (firstSelectedOptionElement?.display && loc(firstSelectedOptionElement.display)) ||\n firstSelectedOptionElement?.textContent?.trim() ||\n this.value ||\n ''\n );\n }\n }\n\n checkSelectedDisplay() {\n // This prevents an undefined property error when the spec tests are run\n try {\n this.hostElement;\n } catch (error) {\n return null;\n }\n let namedSlot = this.selectedDisplaySlot;\n const { value, multiple, selectedOptions, multilineOptions, firstSelectedOptionElement, prioritizeSearch } =\n this;\n const hasNoValue = !value && multiple && !selectedOptions?.length;\n if (prioritizeSearch || !multilineOptions || hasNoValue) return this.clearSelectedDisplay();\n\n if (!firstSelectedOptionElement || firstSelectedOptionElement.display) return this.clearSelectedDisplay();\n\n // Clone selected option and remove elements with hide-on-select attribute\n const selectionClone = firstSelectedOptionElement.firstElementChild.cloneNode(true) as HTMLElement;\n selectionClone.querySelectorAll('[hide-on-select]').forEach(element => element.remove());\n\n if (namedSlot) {\n const height = namedSlot.clientHeight === 0 ? 'auto' : `${namedSlot.clientHeight}px`;\n namedSlot.style.setProperty('--comp-selected-display-height', height);\n if (namedSlot.firstElementChild.outerHTML !== selectionClone.outerHTML) {\n namedSlot.replaceChild(selectionClone, namedSlot.firstElementChild);\n }\n } else {\n namedSlot = document.createElement('div');\n namedSlot.slot = '_selected-display';\n namedSlot.appendChild(selectionClone);\n this.hostElement.appendChild(namedSlot);\n }\n return namedSlot;\n }\n\n checkSelectedDisplayHeight() {\n const { selectedDisplaySlot } = this;\n if (!selectedDisplaySlot) return;\n selectedDisplaySlot.style.setProperty('--comp-selected-display-height', '44px');\n }\n\n checkSelectedOptions() {\n const { multiple, selectedOptions, value } = this;\n this.optionElements.forEach(option => {\n if (multiple) {\n option.selected = selectedOptions.includes(option.value);\n } else {\n option.selected = option.value === value;\n }\n });\n }\n\n clearSearchText() {\n if (!this.searchText) return;\n this.searchText = '';\n this.input.emit({ query: '' });\n }\n\n clearSelectedDisplay() {\n this.selectedDisplaySlot?.remove();\n }\n\n clearValue() {\n const { multiple } = this;\n this.value = '';\n this.selectedOptions = [];\n this.change.emit({ value: multiple ? undefined : '', selectedOptions: multiple ? [] : undefined });\n }\n\n clickedElsewhere = (event: CustomEvent) => {\n const target = event.target as HTMLClickElsewhereElement;\n if (target.localName !== 'click-elsewhere') return;\n event.stopPropagation();\n const { popoverElement } = this;\n if (!popoverElement) return;\n popoverElement.open = false;\n this.innerInputField.blur();\n };\n\n closeDropdown() {\n this.open = false;\n this.lastTouchWasInPopover = false;\n this.clearSearchText();\n }\n\n destroyEventListeners = () => {\n if (!isMobile()) return;\n screen?.orientation?.removeEventListener('change', this.handleOrientationChange);\n window.removeEventListener('resize', this.handleOrientationChange);\n visualViewport?.removeEventListener('resize', this.handleOrientationChange);\n this.removeTouchEventListeners();\n };\n\n async executeActionSheet(event: MouseEvent | KeyboardEvent) {\n const result = await showActionSheetList(this, event);\n this.focusInput();\n this.handleSelectionChanges(result);\n }\n\n focusInput() {\n this.inputField?.dispatchEvent(new FocusEvent('focus'));\n }\n\n // Helps with checking for calls to handleExternalKeydown in spec tests\n handleOptionListExternalKeydown(event: KeyboardEvent) {\n this.optionList.handleExternalKeydown(event);\n }\n\n handleOrientationChange = () => {\n if (!isMobile()) return;\n\n let isLandscape: boolean;\n if (this.isModule) {\n isLandscape = window.Tecton?.platformDimensions.orientationType.includes('landscape');\n } else {\n isLandscape = screen?.orientation?.type?.includes('landscape');\n }\n if (isLandscape && this.searchable) this.searchable = false;\n if (!isLandscape) this.searchable = this.originalSearchable;\n };\n\n handleSelectionChanges(changeDetails: { value?: string; values?: IOptionValue[] }) {\n const { value = '', values = [] } = changeDetails;\n const selectedOptionValues = values.map(value => value.value);\n const { multiple } = this;\n if (!this.hostElement.onchange) {\n this.selectedOptions = selectedOptionValues;\n }\n\n this.change.emit({\n value: multiple ? undefined : value,\n selectedOptions: multiple ? selectedOptionValues : undefined,\n });\n }\n\n handleTouchMove = (event: TouchEvent) => {\n if (document.activeElement === this.hostElement) {\n const target = event.target as HTMLElement;\n if (target && target !== this.hostElement) {\n this.inputFocused = false;\n this.lastTouchWasInPopover = true;\n target.focus();\n }\n }\n };\n\n initEventListeners = () => {\n if (!isMobile()) return;\n screen?.orientation?.addEventListener('change', this.handleOrientationChange);\n window.addEventListener('resize', this.handleOrientationChange);\n visualViewport?.addEventListener('resize', this.handleOrientationChange);\n };\n\n initMutationObserver = () => {\n const observer = new MutationObserver(this.onMutationObserved);\n observer.observe(this.hostElement, { childList: true, subtree: true });\n this.mutationObserver = observer;\n this.onMutationObserved();\n };\n\n inputBlurHandler = () => {\n this.inputFocused = false;\n };\n\n inputChangeHandler = (event: Event) => {\n event.stopPropagation();\n };\n\n inputClickHandler = async (event: MouseEvent) => {\n event.stopPropagation();\n\n // Check if the last interaction was a touch within the popover\n // If so, don't toggle the dropdown as the user is likely continuing to interact\n if (this.lastTouchWasInPopover && this.open && this.searchable) {\n // Reset the flag and don't toggle\n this.lastTouchWasInPopover = false;\n this.focusInput();\n return;\n }\n\n // Reset the flag for any other click\n this.lastTouchWasInPopover = false;\n\n if (shouldShowActionSheet(this)) {\n return this.executeActionSheet(event);\n }\n this.toggleDropdown();\n this.focusInput();\n };\n\n inputFocusHandler = () => {\n this.inputFocused = true;\n };\n\n inputInputHandler = (event: Q2InputCustomEvent<IEventDetail> & InputEvent) => {\n event.stopPropagation();\n const eventValue = event.detail.value;\n const shouldClearValue = !!this.value;\n\n if (shouldClearValue) this.clearValue();\n if (!this.open) this.openDropdownWithoutActiveElement();\n\n this.prioritizeSearch = true;\n this.searchText = eventValue;\n this.input.emit({ query: eventValue });\n };\n\n inputKeydownHandler = (event: KeyboardEvent) => {\n if (this.readonly || this.disabled) return;\n const { key, shiftKey } = event;\n const isShiftTab = key === 'Tab' && shiftKey;\n const hasSlot = this.hasPopoverTop || this.hasPopoverBottom;\n if (hasSlot && (key === 'Tab' || isShiftTab)) return;\n\n // slots are incompatible with action sheet\n if (shouldShowActionSheet(this, event) && !hasSlot) {\n return this.executeActionSheet(event);\n }\n\n const keysForOptionListToHandle = [\n 'ArrowDown',\n 'ArrowUp',\n 'PageDown',\n 'PageUp',\n 'Home',\n 'End',\n 'Escape',\n 'Tab',\n ];\n\n if (this.searchable && (key === ' ' || key === 'Enter') && this.inputField.value == '') {\n event.preventDefault();\n if (!this.open) this.openDropdownWithoutActiveElement();\n }\n\n if (this.searchable && !keysForOptionListToHandle.includes(key)) return;\n if (this.shouldClearSearchText(event)) this.clearSearchText();\n\n // Prevent click event from firing when spacebar is pressed\n if (key === ' ') event.preventDefault();\n\n this.handleOptionListExternalKeydown(event);\n };\n\n onCustomDisplayClick = (event: MouseEvent) => {\n event.stopPropagation();\n this.focusInput();\n this.toggleDropdown();\n };\n\n onMutationObserved = () => {\n const { hostElement, hasPopoverTop, hasPopoverBottom } = this;\n const slotContainer = hostElement.querySelector('.custom-display-content');\n const displaySlot = hostElement.shadowRoot.querySelector<HTMLSlotElement>('slot[name=\"q2-select-display\"]');\n const hasCustomDisplay = !!displaySlot\n ? displaySlot.assignedNodes().length > 0\n : slotContainer.children.length > 0;\n\n if (this.hasCustomDisplay !== hasCustomDisplay) {\n this.hasCustomDisplay = hasCustomDisplay;\n }\n\n const popTopSlot = hostElement.shadowRoot.querySelector<HTMLSlotElement>('slot[name=\"popover-top\"]');\n const topSlotHasNode = popTopSlot?.assignedNodes().length > 0;\n if (hasPopoverTop !== topSlotHasNode) {\n this.hasPopoverTop = topSlotHasNode;\n }\n\n const popBottomSlot = hostElement.shadowRoot.querySelector<HTMLSlotElement>('slot[name=\"popover-bottom\"]');\n const bottomSlotHasNode = popBottomSlot?.assignedNodes().length > 0;\n if (hasPopoverBottom !== bottomSlotHasNode) {\n this.hasPopoverBottom = bottomSlotHasNode;\n }\n\n this.checkSelectedOptions();\n };\n\n onOptionListChange = (event: Q2OptionListCustomEvent<{ value: string; values: IOptionValue[] }>) => {\n event.stopPropagation();\n const { values } = event.detail;\n\n if (values.length === 0) this.showAllOptions();\n this.handleSelectionChanges(event.detail);\n };\n\n onPopoverState = ({\n detail: { open, action },\n }: CustomEvent<{ open: boolean; action: 'close' | 'select' | 'open' }>) => {\n if (!open || this.searchText) {\n if (action !== 'select') {\n this.optionList.setActiveElement(null);\n }\n this.inputField.focus();\n }\n\n if (this.open === open) return;\n this.open = open;\n };\n\n openDropdownWithoutActiveElement() {\n if (this.readonly || this.disabled) return;\n this.optionList.setActiveElement(null);\n this.open = true;\n }\n\n removeTouchEventListeners = () => {\n if (!isMobile() || !this.popoverElement) return;\n\n this.popoverElement.removeEventListener('touchmove', this.handleTouchMove);\n };\n\n setCustomLabel() {\n const customLabel = this.hostElement.querySelector('[slot=\"label\"]');\n if (customLabel) {\n this.inputField?.appendChild(customLabel.cloneNode(true));\n this.hostElement.removeChild(customLabel);\n }\n }\n\n setStatusMessage(message) {\n clearTimeout(this.statusMessageTimer);\n this.statusMessage = '';\n this.statusMessageTimer = setTimeout(() => {\n this.statusMessage = message;\n }, 1000);\n }\n\n shouldClearSearchText(event: KeyboardEvent) {\n return this.searchable && !!this.searchText && event.key === 'Escape';\n }\n\n showAllOptions = () => {\n this.showSelected = false;\n };\n\n showSelectedOptions = () => {\n this.showSelected = true;\n };\n\n toggleDropdown() {\n if (this.readonly || this.disabled) return;\n\n if (this.open && !this.searchText) {\n this.closeDropdown();\n } else {\n this.openDropdownWithoutActiveElement();\n }\n }\n\n visibilityToggleKeyDown = (event: KeyboardEvent) => {\n const key = event.key;\n const isShiftTab = key === 'Tab' && event.shiftKey;\n const isRadioControlKey = ['ArrowLeft', 'ArrowRight', 'ArrowUp', 'ArrowDown'].includes(key);\n if (isRadioControlKey) event.stopPropagation();\n if (isShiftTab) {\n event.stopPropagation();\n // allows shift+tab keys to select the top slot when present\n if (this.hasPopoverTop) return;\n\n this.optionList.setDefaultActiveElement();\n }\n };\n\n // #endregion\n // #region Render Methods\n\n renderCustomDisplay() {\n const hasSelectedDisplay = this.checkSelectedDisplay();\n if (!hasSelectedDisplay) return;\n this.checkSelectedDisplayHeight();\n\n return (\n <slot\n name=\"_selected-display\"\n slot=\"custom-display\"\n />\n );\n }\n\n renderOptionsDropdown() {\n return (\n <q2-popover\n ref={el => (this.popoverElement = el)}\n controlElement={this.innerInputContainer}\n open={this.open}\n max-height={this.popoverMaxHeight}\n minHeight={this.popoverMinHeight}\n direction={this.popDirection}\n mode={this.popoverMode || undefined}\n block\n >\n <div class=\"popover-content\">\n <q2-option-list\n onPopoverState={this.onPopoverState}\n ref={el => (this.optionList = el)}\n type=\"listbox\"\n id=\"option-list\"\n show-selected={this.showSelected}\n label={this.listLabel}\n multiple={this.multiple}\n selectedOptions={this.structuredSelectedOptions}\n onChange={this.onOptionListChange}\n >\n <slot />\n </q2-option-list>\n <div\n class=\"popover-top-container\"\n ref={el => (this.popoverTopContainer = el)}\n hidden={!this.multiple && !this.hasPopoverTop}\n tabindex=\"-1\"\n >\n <slot name=\"popover-top\"></slot>\n {this.multiple && this.renderVisibilityToggle()}\n </div>\n </div>\n <div\n class=\"popover-bottom-container\"\n hidden={!this.hasPopoverBottom}\n tabindex=\"-1\"\n >\n <slot name=\"popover-bottom\" />\n </div>\n </q2-popover>\n );\n }\n\n renderSelectField() {\n return (\n <Fragment>\n <div\n aria-live=\"polite\"\n aria-atomic=\"true\"\n role=\"status\"\n class=\"sr\"\n >\n {this.statusMessage}\n </div>\n <q2-input\n ref={el => (this.inputField = el)}\n class=\"q2-select-input\"\n label={(this.label && loc(this.label)) || ''}\n value={this.selectedDisplay}\n clearable={(this.clearable && (!!this.value || !!this.selectedOptions?.length)) || undefined}\n errors={\n (Array.isArray(this.errors) &&\n this.errors.length > 0 &&\n this.errors.map(error => loc(error))) ||\n (this.invalid && ['tecton.element.select.invalid']) ||\n []\n }\n disabled={this.disabled}\n optional={this.optional}\n readonly={!!this.readonly}\n placeholder={this.placeholder || undefined}\n hideLabel={this.hideLabel}\n ariaExpanded={`${this.open}`}\n ariaControls=\"option-list\"\n ariaHaspopup=\"listbox\"\n test-id=\"toggleDropdown\"\n hide-messages\n iconRight=\"chevron-down\"\n onClick={this.inputClickHandler}\n onInput={this.inputInputHandler}\n onKeyDown={this.inputKeydownHandler}\n onFocus={this.inputFocusHandler}\n onBlur={this.inputBlurHandler}\n onChange={this.inputChangeHandler}\n badgeValue={this.badgeValue}\n badgeTheme={this.inputFocused ? 'primary' : undefined}\n _role=\"combobox\"\n _preventEntry={!this.searchable}\n >\n {this.renderCustomDisplay()}\n </q2-input>\n <div\n class=\"custom-display-content\"\n hidden={!this.hasCustomDisplay || !!this.searchText}\n onClick={this.onCustomDisplayClick}\n >\n <slot name=\"q2-select-display\" />\n </div>\n {this.renderOptionsDropdown()}\n </Fragment>\n );\n }\n\n renderVisibilityToggle() {\n const selectedOptionsCount = this.selectedOptions?.length ?? 0;\n const { showSelected } = this;\n return (\n <div class=\"multi-select-header\">\n <fieldset>\n <legend aria-label={loc('tecton.element.select.multiHeader.showing')}>\n {loc('tecton.element.select.multiHeader.showing')}\n </legend>\n <div>\n <input\n class=\"sr\"\n type=\"radio\"\n id=\"all\"\n name=\"viewDisplay\"\n value=\"all\"\n checked={!showSelected}\n aria-label={loc('tecton.element.select.multiHeader.allAriaLabel')}\n test-id=\"allOptionsButton\"\n onClick={this.showAllOptions}\n onKeyDown={this.visibilityToggleKeyDown}\n />\n <label htmlFor=\"all\">{loc('tecton.element.select.multiHeader.all')}</label>\n </div>\n\n <div>\n <input\n class=\"sr\"\n type=\"radio\"\n id=\"selected\"\n disabled={selectedOptionsCount === 0}\n name=\"viewDisplay\"\n value=\"selected\"\n aria-label={loc('tecton.element.select.multiHeader.selectedAriaLabel', [\n selectedOptionsCount,\n ])}\n checked={showSelected}\n test-id=\"selectedOptionsButton\"\n onClick={this.showSelectedOptions}\n onKeyDown={this.visibilityToggleKeyDown}\n />\n <label htmlFor=\"selected\">\n {loc('tecton.element.select.multiHeader.selected', [selectedOptionsCount])}\n </label>\n </div>\n </fieldset>\n </div>\n );\n }\n\n render() {\n return (\n <click-elsewhere\n class={this.wrapperClasses}\n onChange={this.clickedElsewhere}\n >\n {this.renderSelectField()}\n </click-elsewhere>\n );\n }\n\n // #endregion\n}\n\n// #endregion\n"],"mappings":"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"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { r as e, c as t, h as i, F as s, H as n, g as a } from "./index-7a5365e2.js";
|
|
2
2
|
|
|
3
|
-
import { c as o, n as d, l as h } from "./index-
|
|
3
|
+
import { c as o, n as d, l as h } from "./index-52ca69b4.js";
|
|
4
4
|
|
|
5
5
|
const c = "*{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}";
|
|
6
6
|
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { r as t, c as e, h as a, F as r, g as i } from "./index-7a5365e2.js";
|
|
2
2
|
|
|
3
|
-
import { o as s, i as c, c as n, l as o } from "./index-
|
|
3
|
+
import { o as s, i as c, c as n, l as o } from "./index-52ca69b4.js";
|
|
4
4
|
|
|
5
5
|
const l = '*{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}';
|
|
6
6
|
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { r as t, c as e, h as r, F as i, g as o } from "./index-7a5365e2.js";
|
|
2
2
|
|
|
3
|
-
import { o as s, i as a, l } from "./index-
|
|
3
|
+
import { o as s, i as a, l } from "./index-52ca69b4.js";
|
|
4
4
|
|
|
5
5
|
const n = '*{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}';
|
|
6
6
|
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { r as t, c as i, h as a, F as e, H as o, g as r } from "./index-7a5365e2.js";
|
|
2
2
|
|
|
3
|
-
import { o as s, i as n, w as c, l as h } from "./index-
|
|
3
|
+
import { o as s, i as n, w as c, l as h } from "./index-52ca69b4.js";
|
|
4
4
|
|
|
5
5
|
import { a as l, s as p } from "./action-sheet-e64cb6f7.js";
|
|
6
6
|
|