q2-tecton-elements 1.67.2 → 1.68.0

package/dist/collection/components/q2-pill/q2-pill.js.map

@@ -1 +1 @@
-{"version":3,"file":"q2-pill.js","sourceRoot":"","sources":["../../../../src/components/q2-pill/q2-pill.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n    Component,\n    State,\n    Prop,\n    h,\n    ComponentInterface,\n    Listen,\n    Watch,\n    Element,\n    EventEmitter,\n    Event,\n    Method,\n} from '@stencil/core';\nimport { isEventFromElement, loc, overrideFocus, resizeIframe, waitForNextPaint } from 'src/utils';\nimport mirrorEmit from '@/utils/mirror-emit';\nimport { shouldShowActionSheet, showActionSheetList } from 'src/utils/action-sheet';\nimport { OptionValue } from '../q2-option-list/q2-option-list';\n\n/**\n * @name Pill\n * @category Display\n * @summary Use for displaying and removing active filters in data views.\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 */\n@Component({ tag: 'q2-pill', shadow: true, styleUrl: 'q2-pill.scss' })\nexport class Q2Pill implements ComponentInterface {\n    // #region Own Properties\n\n    mutationObserver: MutationObserver;\n    optionList: HTMLQ2OptionListElement;\n    popoverBottomContainer: HTMLElement;\n    popoverElement: HTMLQ2PopoverElement;\n    popoverTopContainer: HTMLElement;\n    primaryBtn: HTMLButtonElement;\n    primaryBtnWrapper: HTMLElement;\n    scheduledAfterRender: (() => void)[] = [];\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    hasPopoverBottom = false;\n\n    @State()\n    hasPopoverTop = false;\n\n    @State()\n    optionCount: number;\n\n    @State()\n    selectedOptionElements: HTMLQ2OptionElement[] = [];\n\n    // #endregion\n    // #region Public Property API\n\n    /** Determine if the elements is in the selected state, with values. */\n    @Prop({ reflect: true, mutable: true })\n    active: boolean;\n\n    /** Indicates that the pill has no border */\n    @Prop({ reflect: true })\n    borderless: boolean;\n\n    /** Indicates the pill cannot be focused or interacted with. */\n    @Prop({ reflect: true })\n    disabled: boolean;\n\n    /**\n     * Instructs the component to use the action sheet workflow for displaying its options.\n     *\n     * For more information, see [Action Sheets](https://tecton.q2developer.com/guides/action-sheets/).\n     */\n    @Prop()\n    hoist: boolean = !!window.Tecton?.useActionSheets;\n\n    /**\n     * The text that populates the label.\n     * @localizable\n     */\n    @Prop({ reflect: true })\n    label: string;\n\n    /**\n     * The maximum number of characters to display before ellipcizing.\n     * @info\n     * Limitless by default.\n     */\n    @Prop({ reflect: true })\n    maxLength: number;\n\n    /**\n     * Enables the multi-select ability for the dropdown.\n     * @info\n     * Only applicable when options are provided.\n     */\n    @Prop({ reflect: true })\n    multiple: boolean;\n\n    /**\n     * Determine whether the popover is open or closed.\n     *\n     * @readonly\n     */\n    @Prop({ reflect: true, mutable: true })\n    open: boolean;\n\n    /** Determines the label that is applied to the option list for accessibility purposes. */\n    @Prop()\n    optionListLabel: string;\n\n    /** Aligns the popover dropdown to the left or right side of the input field. */\n    @Prop({ mutable: true })\n    popoverAlignment: 'left' | 'right' = 'right';\n\n    /**\n     * Force the direction of the popover dropdown when it opens.\n     * If no value is passed, the component will auto-detect the direction based on available space.\n     */\n    @Prop()\n    popoverDirection: 'up' | 'down';\n\n    /**\n     * Force the maximum height of the popover. This value will be interpreted as pixels.\n     * If no value is passed, or the value exceeds available space, the component will auto-detect the maximum height based on available space.\n     */\n    @Prop()\n    popoverMaxHeight: number;\n\n    /** @deprecated */\n    @Prop()\n    popoverMinHeight: number = 150;\n\n    /** A list of the selected options on the element. */\n    @Prop({ mutable: true })\n    selectedOptions: OptionValue[] = [];\n\n    /** The color of the element when in the active state. */\n    @Prop({ reflect: true })\n    theme: 'primary' | 'secondary' | 'tertiary';\n\n    /** The value emitted when the component is selected. */\n    @Prop({ reflect: true, mutable: true })\n    value: string;\n\n    // #endregion\n    // #region Events\n\n    /**\n     * Emitted when the pill is clicked or the selected options change.\n     *\n     * When multi-select is enabled, `value` will be `undefined`.\n     * @legacyEvent\n     * @deprecated Use 'tctChange' instead\n     */\n    @Event()\n    change: EventEmitter<{ value: string; values: OptionValue[]; active: boolean }>;\n\n    /**\n     * Emitted when the pill is clicked or the selected options change.\n     *\n     * When multi-select is enabled, `value` will be `undefined`.\n     * @legacyEvent\n     */\n    @Event()\n    tctChange: EventEmitter<{ value: string; values: OptionValue[]; active: boolean }>;\n\n    // #endregion\n    // #region Component Lifecycle Events\n\n    disconnectedCallback() {\n        this.mutationObserver?.disconnect();\n        this.mutationObserver = null;\n    }\n\n    componentWillLoad() {\n        const observer = new MutationObserver(this.onMutationObserved);\n        observer.observe(this.hostElement, { childList: true, attributes: true });\n        this.mutationObserver = observer;\n    }\n\n    componentDidLoad() {\n        overrideFocus(this.hostElement);\n        this.syncValueProperties();\n    }\n\n    componentDidRender() {\n        this.scheduledAfterRender.forEach(fn => fn());\n        this.scheduledAfterRender = [];\n    }\n\n    // #endregion\n    // #region Listeners\n\n    @Listen('displayChanged')\n    handleSelectedDisplay() {\n        if (this.multiple) return;\n        this.updateSelectedOptionElements();\n    }\n\n    @Listen('focus')\n    delegateFocus(event: FocusEvent) {\n        if (!isEventFromElement(event, this.hostElement)) return;\n        this.primaryBtn.focus();\n    }\n\n    @Listen('popoverStateChanged')\n    async popoverStateHandler({ detail: { open } }: CustomEvent<{ open: boolean }>) {\n        if (this.open !== open) this.open = open;\n        if (open) return;\n        this.setOptionListActiveElement(null);\n    }\n\n    // #endregion\n    // #region Public Methods API\n\n    /**\n     * Emulates clicking the `<button>` 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 `<button>` 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 clicking the `<button>` to display the popover and selecting the option(s) with the specified value(s).\n     *\n     * If 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 valueSet = new Set(Array.isArray(values) ? values : [values]);\n        const allOptions = (await this.getOptionListOptions()) as HTMLQ2OptionElement[];\n        if (!this.open) {\n            await this.openPopover();\n            await waitForNextPaint();\n        }\n\n        valueSet.forEach(value => {\n            allOptions.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('selectedOptions')\n    selectedOptionsChanged(newValue) {\n        const { multiple } = this;\n        const firstValue = newValue?.[0]?.value ?? null;\n        if (multiple) {\n            if (this.value) this.value = null;\n            this.updateSelectedOptionElements();\n        } else if (this.value === firstValue) {\n            this.updateSelectedOptionElements();\n        } else {\n            this.value = firstValue;\n        }\n    }\n\n    @Watch('value')\n    @Watch('label')\n    async valueChanged(newValue, _oldValue, propName) {\n        const { label, multiple, selectedOptions, value } = this;\n        const valueProxy = propName === 'value' ? newValue : value;\n        const labelProxy = propName === 'label' ? newValue : label;\n        if (multiple) return;\n        const firstValue = selectedOptions?.[0]?.value ?? null;\n        if (propName === 'value' && newValue === firstValue) this.updateSelectedOptionElements();\n        else {\n            const selectedOption = (await this.getOption(newValue)) as HTMLQ2OptionElement;\n            const { value, display } = selectedOption || { value: valueProxy, display: labelProxy };\n            this.selectedOptions = value ? [{ value, display }] : [];\n        }\n    }\n\n    // #endregion\n    // #region Local Methods\n\n    get buttonContent() {\n        const { label, selectedOptions, selectedOptionElements, optionCount } = this;\n        if (!optionCount || selectedOptionElements.length === 0) return loc(label);\n        else if (selectedOptionElements.length === 1) return `${loc(selectedOptionElements[0].display)}`;\n\n        return loc('tecton.element.pill.activeCount', { count: selectedOptions.length });\n    }\n\n    get truncatedButtonContent() {\n        const { maxLength, buttonContent } = this;\n        if (maxLength && buttonContent.length > maxLength) return `${buttonContent.substring(0, maxLength)}…`;\n        else return buttonContent;\n    }\n\n    _togglePopover() {\n        const { primaryBtn } = this;\n        primaryBtn?.click();\n        primaryBtn?.focus();\n        primaryBtn.dispatchEvent(new FocusEvent('focus'));\n    }\n\n    clearSelectedOptions = () => {\n        this.selectedOptions = [];\n        this.value = null;\n        this.active = false;\n        this.open = false;\n        this.primaryBtn.focus();\n        mirrorEmit(this, ['change', 'tctChange'], { value: null, values: [], active: false });\n        this.scheduledAfterRender.push(resizeIframe);\n    };\n\n    determineOptionCount = async () => {\n        if (this.optionList) {\n            const allOptions = await this.getOptionListOptions();\n            this.optionCount = allOptions.length;\n        } else {\n            const numberOfOptions = this.hostElement.querySelectorAll('q2-option').length;\n            this.optionCount = numberOfOptions;\n        }\n    };\n\n    executeActionSheet = async (event: MouseEvent | KeyboardEvent) => {\n        const result = await showActionSheetList(this, event);\n        this.primaryBtn.focus();\n        this.handleSelectionChanges(result);\n    };\n\n    getOption = async (value: string) => {\n        if (this.optionList) {\n            const options = await this.getOptionListOptions();\n            return options.find(option => option.value === value);\n        } else {\n            return this.hostElement.querySelector<HTMLQ2OptionElement>(`q2-option[value=\"${value}\"]`);\n        }\n    };\n\n    // for spec testing\n    getOptionListOptions = async () => {\n        return await this.optionList?.getOptions();\n    };\n\n    handleChange = event => {\n        event.stopPropagation();\n        if (!this.optionCount) return;\n        this.handleSelectionChanges(event.detail);\n    };\n\n    handleClick = async (event: MouseEvent) => {\n        event.stopPropagation();\n        if (this.disabled) return;\n        if (this.optionCount) {\n            if (shouldShowActionSheet(this)) {\n                this.executeActionSheet(event);\n            } else {\n                await this.popoverElement.toggle();\n            }\n        } else {\n            const { value, label } = this;\n            const isActive = (this.active = !this.active);\n            const values = isActive ? [{ value, display: label }] : [];\n            mirrorEmit(this, ['change', 'tctChange'], {\n                value,\n                values,\n                active: isActive,\n            });\n        }\n    };\n\n    handleFocusOut = async (event: FocusEvent) => {\n        const relatedTarget = event.relatedTarget as unknown as HTMLElement;\n        if (this.popoverElement?.contains(relatedTarget)) return;\n        if (this.hostElement.contains(relatedTarget)) return;\n        this.open = false;\n    };\n\n    handleKeydown = async (event: KeyboardEvent) => {\n        const isTabMetaOrCtrl = event.metaKey || event.ctrlKey || event.key === 'Tab';\n        if (!this.optionCount || this.disabled || isTabMetaOrCtrl) return;\n        event.preventDefault();\n        const hasSlot = this.hasPopoverTop || this.hasPopoverBottom;\n\n        // slots are incompatible with action sheet\n        if (shouldShowActionSheet(this, event) && !hasSlot) {\n            this.executeActionSheet(event);\n        } else {\n            this.handleOptionListExternalKeydown(event);\n        }\n    };\n\n    // for spec testing\n    handleOptionListExternalKeydown = async (event: KeyboardEvent) => {\n        await this.optionList?.handleExternalKeydown(event);\n    };\n\n    handleSelectionChanges = async (changeDetails: { value?: string; values?: OptionValue[] }) => {\n        const { multiple } = this;\n        const { value = '', values = [] } = changeDetails;\n        const isActive = multiple ? !!values.length : !!value;\n        if (!this.hostElement.onchange) {\n            if (multiple) {\n                this.selectedOptions = values;\n                this.value = undefined;\n            } else {\n                const selectedOption = (await this.getOption(value)) as HTMLQ2OptionElement;\n                this.selectedOptions = selectedOption\n                    ? [{ value: selectedOption.value, display: selectedOption.display }]\n                    : [];\n                this.value = selectedOption?.value || undefined;\n            }\n        }\n\n        mirrorEmit(this, ['change', 'tctChange'], {\n            value: multiple ? undefined : value,\n            values,\n            active: isActive,\n        });\n    };\n\n    handleWrapperClick = () => {\n        this.primaryBtn.focus();\n        this.primaryBtn.click();\n    };\n\n    onClickElsewhere = (event: CustomEvent) => {\n        const target = event.target as HTMLClickElsewhereElement;\n        if (target.localName === 'click-elsewhere') {\n            event.stopPropagation();\n            const { popoverElement } = this;\n            if (!popoverElement) return;\n            popoverElement.open = false;\n        }\n    };\n\n    onMutationObserved = () => {\n        this.updateSlotState();\n        this.determineOptionCount();\n        this.updateSelectedOptionElements();\n    };\n\n    onPopoverState = (event: CustomEvent<{ open: boolean; action: 'close' | 'select' | 'open' }>) => {\n        const { open, action } = event.detail;\n        if (open) return;\n\n        switch (action) {\n            case 'select':\n            case 'close':\n                this.primaryBtn.focus();\n                break;\n        }\n    };\n\n    // for spec testing\n    setOptionListActiveElement = async (index: number) => {\n        await this.optionList?.setActiveElement(index);\n    };\n\n    syncValueProperties = () => {\n        const { value, selectedOptions } = this;\n        if (!!selectedOptions?.length) this.selectedOptionsChanged(selectedOptions);\n        else if (value) this.valueChanged(value, null, 'value');\n    };\n\n    updateSelectedOptionElements = async () => {\n        const { selectedOptions = [] } = this;\n        const selectedValues = selectedOptions.map(option => option.value);\n        const options = await this.getOptionListOptions();\n        if (this.optionCount) this.active = !!selectedValues.length;\n        this.selectedOptionElements =\n            (options?.filter(option => selectedValues.includes(option.value)) as HTMLQ2OptionElement[]) || [];\n    };\n\n    updateSlotState = () => {\n        const { hostElement, hasPopoverTop, hasPopoverBottom } = this;\n        const popTopSlot = hostElement.shadowRoot.querySelector<HTMLSlotElement>('slot[name=\"popover-top\"]');\n        const popBottomSlot = hostElement.shadowRoot.querySelector<HTMLSlotElement>('slot[name=\"popover-bottom\"]');\n        const topSlotHasNode = popTopSlot?.assignedNodes().length > 0;\n        const bottomSlotHasNode = popBottomSlot?.assignedNodes().length > 0;\n\n        if (hasPopoverTop !== topSlotHasNode) this.hasPopoverTop = topSlotHasNode;\n        if (hasPopoverBottom !== bottomSlotHasNode) this.hasPopoverBottom = bottomSlotHasNode;\n    };\n\n    // #endregion\n    // #region Render Methods\n\n    renderHiddenElement() {\n        return (\n            <div\n                id=\"option-description\"\n                class=\"sr\"\n                aria-hidden=\"true\"\n            >\n                {loc('tecton.element.optionList.optionCount', [this.optionCount])}\n            </div>\n        );\n    }\n\n    renderIcon() {\n        const { optionCount, active } = this;\n        const isButton = optionCount && active;\n        const TagName = isButton ? 'button' : 'div';\n        const iconName = isButton || !optionCount ? 'close' : 'chevron-down';\n\n        return (\n            <TagName\n                class=\"btn-close\"\n                onClick={(isButton && this.clearSelectedOptions) || undefined}\n                disabled={(isButton && this.disabled) || undefined}\n                aria-label={(isButton && loc('tecton.element.pill.clearSelection')) || undefined}\n                type={(isButton && 'button') || undefined}\n            >\n                <q2-icon type={iconName}></q2-icon>\n            </TagName>\n        );\n    }\n\n    render() {\n        const { optionCount, active, open } = this;\n        const wrapperClassNames = ['btn-wrapper'];\n        if (optionCount || active) wrapperClassNames.push('has-icon');\n        if (optionCount) wrapperClassNames.push('has-options');\n\n        return (\n            <click-elsewhere onChange={this.onClickElsewhere}>\n                <div class={wrapperClassNames.join(' ')}>\n                    <div\n                        class=\"btn-height-wrapper\"\n                        ref={el => (this.primaryBtnWrapper = el)}\n                        onClick={this.handleWrapperClick}\n                        tabIndex={-1}\n                    >\n                        <button\n                            class=\"btn-primary\"\n                            test-id=\"btn-control\"\n                            type=\"button\"\n                            role={(optionCount && 'combobox') || undefined}\n                            ref={el => (this.primaryBtn = el)}\n                            onClick={this.handleClick}\n                            onKeyDown={this.handleKeydown}\n                            onFocusout={this.handleFocusOut}\n                            disabled={this.disabled}\n                            aria-roledescription={!optionCount && 'filter'}\n                            aria-controls={(optionCount && 'option-list') || undefined}\n                            aria-expanded={(optionCount && `${!!open}`) || undefined}\n                            aria-label={`${this.buttonContent}${!optionCount && active ? ` ${loc('tecton.element.pill.active')}` : ''}`}\n                            aria-describedby={(optionCount && 'option-description') || undefined}\n                        >\n                            {this.truncatedButtonContent}\n                        </button>\n                    </div>\n                    {this.renderIcon()}\n                    {!!optionCount && this.renderHiddenElement()}\n                </div>\n                {this.optionCount > 0 && (\n                    <q2-popover\n                        ref={el => (this.popoverElement = el)}\n                        controlElement={this.primaryBtn}\n                        open={this.open}\n                        max-height={this.popoverMaxHeight}\n                        minHeight={this.popoverMinHeight}\n                        direction={this.popoverDirection}\n                        align={this.popoverAlignment}\n                        onFocusout={this.handleFocusOut}\n                    >\n                        <div class=\"popover-content\">\n                            <div\n                                ref={el => (this.popoverTopContainer = el)}\n                                class=\"popover-top-container\"\n                                tabindex=\"-1\"\n                                hidden={!this.hasPopoverTop}\n                                onKeyDown={this.handleKeydown}\n                            >\n                                <slot name=\"popover-top\"></slot>\n                            </div>\n                            <q2-option-list\n                                type=\"listbox\"\n                                ref={el => (this.optionList = el)}\n                                id=\"option-list\"\n                                onChange={this.handleChange}\n                                multiple={this.multiple}\n                                selectedOptions={this.selectedOptions}\n                                onReady={() => this.updateSelectedOptionElements()}\n                                onPopoverState={this.onPopoverState}\n                                label={loc('tecton.element.optionList.label', [this.optionListLabel])}\n                            >\n                                <slot />\n                            </q2-option-list>\n                            <div\n                                ref={el => (this.popoverBottomContainer = el)}\n                                class=\"popover-bottom-container\"\n                                tabindex=\"-1\"\n                                hidden={!this.hasPopoverBottom}\n                                onKeyDown={this.handleKeydown}\n                            >\n                                <slot name=\"popover-bottom\"></slot>\n                            </div>\n                        </div>\n                    </q2-popover>\n                )}\n            </click-elsewhere>\n        );\n    }\n\n    // #endregion\n}\n"]}
+{"version":3,"file":"q2-pill.js","sourceRoot":"","sources":["../../../../src/components/q2-pill/q2-pill.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n    Component,\n    State,\n    Prop,\n    h,\n    ComponentInterface,\n    Listen,\n    Watch,\n    Element,\n    EventEmitter,\n    Event,\n    Method,\n} from '@stencil/core';\nimport { isEventFromElement, loc, overrideFocus, resizeIframe, waitForNextPaint } from 'src/utils';\nimport mirrorEmit from '@/utils/mirror-emit';\nimport { shouldShowActionSheet, showActionSheetList } from 'src/utils/action-sheet';\nimport { OptionValue } from '../q2-option-list/q2-option-list';\n\n/**\n * @name Pill\n * @category Display\n * @summary Use for displaying and removing active filters in data views.\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 */\n@Component({ tag: 'q2-pill', shadow: true, styleUrl: 'q2-pill.scss' })\nexport class Q2Pill implements ComponentInterface {\n    // #region Own Properties\n\n    mutationObserver: MutationObserver;\n    optionList: HTMLQ2OptionListElement;\n    popoverBottomContainer: HTMLElement;\n    popoverElement: HTMLQ2PopoverElement;\n    popoverTopContainer: HTMLElement;\n    primaryBtn: HTMLButtonElement;\n    primaryBtnWrapper: HTMLElement;\n    scheduledAfterRender: (() => void)[] = [];\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    hasPopoverBottom = false;\n\n    @State()\n    hasPopoverTop = false;\n\n    @State()\n    optionCount: number;\n\n    @State()\n    selectedOptionElements: HTMLQ2OptionElement[] = [];\n\n    // #endregion\n    // #region Public Property API\n\n    /** Determine if the elements is in the selected state, with values. */\n    @Prop({ reflect: true, mutable: true })\n    active: boolean;\n\n    /** Indicates that the pill has no border */\n    @Prop({ reflect: true })\n    borderless: boolean;\n\n    /** Indicates the pill cannot be focused or interacted with. */\n    @Prop({ reflect: true })\n    disabled: boolean;\n\n    /**\n     * Instructs the component to use the action sheet workflow for displaying its options.\n     *\n     * For more information, see [Action Sheets](https://tecton.q2developer.com/guides/action-sheets/).\n     */\n    @Prop()\n    hoist: boolean = !!window.Tecton?.useActionSheets;\n\n    /**\n     * The text that populates the label.\n     * @localizable\n     */\n    @Prop({ reflect: true })\n    label: string;\n\n    /**\n     * The maximum number of characters to display before ellipcizing.\n     * @info\n     * Limitless by default.\n     */\n    @Prop({ reflect: true })\n    maxLength: number;\n\n    /**\n     * Enables the multi-select ability for the dropdown.\n     * @info\n     * Only applicable when options are provided.\n     */\n    @Prop({ reflect: true })\n    multiple: boolean;\n\n    /**\n     * Determine whether the popover is open or closed.\n     *\n     * @readonly\n     */\n    @Prop({ reflect: true, mutable: true })\n    open: boolean;\n\n    /** Determines the label that is applied to the option list for accessibility purposes. */\n    @Prop()\n    optionListLabel: string;\n\n    /** Aligns the popover dropdown to the left or right side of the input field. */\n    @Prop({ mutable: true })\n    popoverAlignment: 'left' | 'right' = 'right';\n\n    /**\n     * Force the direction of the popover dropdown when it opens.\n     * If no value is passed, the component will auto-detect the direction based on available space.\n     */\n    @Prop()\n    popoverDirection: 'up' | 'down';\n\n    /**\n     * Force the maximum height of the popover. This value will be interpreted as pixels.\n     * If no value is passed, or the value exceeds available space, the component will auto-detect the maximum height based on available space.\n     */\n    @Prop()\n    popoverMaxHeight: number;\n\n    /** @deprecated */\n    @Prop()\n    popoverMinHeight: number = 150;\n\n    /** A list of the selected options on the element. */\n    @Prop({ mutable: true })\n    selectedOptions: OptionValue[] = [];\n\n    /** The color of the element when in the active state. */\n    @Prop({ reflect: true })\n    theme: 'primary' | 'secondary' | 'tertiary';\n\n    /** The value emitted when the component is selected. */\n    @Prop({ reflect: true, mutable: true })\n    value: string;\n\n    // #endregion\n    // #region Events\n\n    /**\n     * Emitted when the pill is clicked or the selected options change.\n     *\n     * When multi-select is enabled, `value` will be `undefined`.\n     * @legacyEvent\n     * @deprecated Use 'tctChange' instead\n     */\n    @Event()\n    change: EventEmitter<{ value: string; values: OptionValue[]; active: boolean }>;\n\n    /**\n     * Emitted when the pill is clicked or the selected options change.\n     *\n     * When multi-select is enabled, `value` will be `undefined`.\n     * @legacyEvent\n     */\n    @Event()\n    tctChange: EventEmitter<{ value: string; values: OptionValue[]; active: boolean }>;\n\n    // #endregion\n    // #region Component Lifecycle Events\n\n    disconnectedCallback() {\n        this.mutationObserver?.disconnect();\n        this.mutationObserver = null;\n    }\n\n    componentWillLoad() {\n        const observer = new MutationObserver(this.onMutationObserved);\n        observer.observe(this.hostElement, { childList: true, attributes: true });\n        this.mutationObserver = observer;\n    }\n\n    componentDidLoad() {\n        overrideFocus(this.hostElement);\n        this.syncValueProperties();\n    }\n\n    componentDidRender() {\n        this.scheduledAfterRender.forEach(fn => fn());\n        this.scheduledAfterRender = [];\n    }\n\n    // #endregion\n    // #region Listeners\n\n    @Listen('displayChanged')\n    handleSelectedDisplay() {\n        if (this.multiple) return;\n        this.updateSelectedOptionElements();\n    }\n\n    @Listen('focus')\n    delegateFocus(event: FocusEvent) {\n        if (!isEventFromElement(event, this.hostElement)) return;\n        this.primaryBtn.focus();\n    }\n\n    @Listen('popoverStateChanged')\n    async popoverStateHandler({ detail: { open } }: CustomEvent<{ open: boolean }>) {\n        if (this.open !== open) this.open = open;\n        if (open) return;\n        this.setOptionListActiveElement(null);\n    }\n\n    // #endregion\n    // #region Public Methods API\n\n    /**\n     * Emulates clicking the `<button>` 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 `<button>` 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 clicking the `<button>` to display the popover and selecting the option(s) with the specified value(s).\n     *\n     * If 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 valueSet = new Set(Array.isArray(values) ? values : [values]);\n        const allOptions = (await this.getOptionListOptions()) as HTMLQ2OptionElement[];\n        if (!this.open) {\n            await this.openPopover();\n            await waitForNextPaint();\n        }\n\n        valueSet.forEach(value => {\n            allOptions.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('selectedOptions')\n    selectedOptionsChanged(newValue) {\n        const { multiple } = this;\n        const firstValue = newValue?.[0]?.value ?? null;\n        if (multiple) {\n            if (this.value) this.value = null;\n            this.updateSelectedOptionElements();\n        } else if (this.value === firstValue) {\n            this.updateSelectedOptionElements();\n        } else {\n            this.value = firstValue;\n        }\n    }\n\n    @Watch('value')\n    @Watch('label')\n    async valueChanged(newValue, _oldValue, propName) {\n        const { label, multiple, selectedOptions, value } = this;\n        const valueProxy = propName === 'value' ? newValue : value;\n        const labelProxy = propName === 'label' ? newValue : label;\n        if (multiple) return;\n        const firstValue = selectedOptions?.[0]?.value ?? null;\n        if (propName === 'value' && newValue === firstValue) this.updateSelectedOptionElements();\n        else {\n            const selectedOption = (await this.getOption(newValue)) as HTMLQ2OptionElement;\n            const { value, display } = selectedOption || { value: valueProxy, display: labelProxy };\n            this.selectedOptions = value ? [{ value, display }] : [];\n        }\n    }\n\n    // #endregion\n    // #region Local Methods\n\n    get buttonContent() {\n        const { label, selectedOptionElements, optionCount, maxLength } = this;\n        const count = selectedOptionElements.length;\n\n        let text: string;\n        if (!optionCount || count === 0) {\n            text = loc(label);\n        } else if (count === 1) {\n            text = loc(selectedOptionElements[0].display);\n        } else {\n            const firstDisplay = loc(selectedOptionElements[0].display);\n            const suffix = ` +${count - 1}`;\n            return {\n                text: `${firstDisplay}${suffix}`,\n                truncatedText: `${this._truncate(firstDisplay, maxLength)}${suffix}`,\n            };\n        }\n\n        return { text, truncatedText: this._truncate(text, maxLength) };\n    }\n\n    _togglePopover() {\n        const { primaryBtn } = this;\n        primaryBtn?.click();\n        primaryBtn?.focus();\n        primaryBtn.dispatchEvent(new FocusEvent('focus'));\n    }\n\n    _truncate(text: string = '', maxLength: number = 0) {\n        return maxLength && text.length > maxLength ? `${text.substring(0, maxLength)}…` : text;\n    }\n\n    clearSelectedOptions = () => {\n        this.selectedOptions = [];\n        this.value = null;\n        this.active = false;\n        this.open = false;\n        this.primaryBtn.focus();\n        mirrorEmit(this, ['change', 'tctChange'], { value: null, values: [], active: false });\n        this.scheduledAfterRender.push(resizeIframe);\n    };\n\n    determineOptionCount = async () => {\n        if (this.optionList) {\n            const allOptions = await this.getOptionListOptions();\n            this.optionCount = allOptions.length;\n        } else {\n            const numberOfOptions = this.hostElement.querySelectorAll('q2-option').length;\n            this.optionCount = numberOfOptions;\n        }\n    };\n\n    executeActionSheet = async (event: MouseEvent | KeyboardEvent) => {\n        const result = await showActionSheetList(this, event);\n        this.primaryBtn.focus();\n        this.handleSelectionChanges(result);\n    };\n\n    getOption = async (value: string) => {\n        if (this.optionList) {\n            const options = await this.getOptionListOptions();\n            return options.find(option => option.value === value);\n        } else {\n            return this.hostElement.querySelector<HTMLQ2OptionElement>(`q2-option[value=\"${value}\"]`);\n        }\n    };\n\n    // for spec testing\n    getOptionListOptions = async () => {\n        return await this.optionList?.getOptions();\n    };\n\n    handleChange = event => {\n        event.stopPropagation();\n        if (!this.optionCount) return;\n        this.handleSelectionChanges(event.detail);\n    };\n\n    handleClick = async (event: MouseEvent) => {\n        event.stopPropagation();\n        if (this.disabled) return;\n        if (this.optionCount) {\n            if (shouldShowActionSheet(this)) {\n                this.executeActionSheet(event);\n            } else {\n                await this.popoverElement.toggle();\n            }\n        } else {\n            const { value, label } = this;\n            const isActive = (this.active = !this.active);\n            const values = isActive ? [{ value, display: label }] : [];\n            mirrorEmit(this, ['change', 'tctChange'], {\n                value,\n                values,\n                active: isActive,\n            });\n        }\n    };\n\n    handleFocusOut = async (event: FocusEvent) => {\n        const relatedTarget = event.relatedTarget as unknown as HTMLElement;\n        if (this.popoverElement?.contains(relatedTarget)) return;\n        if (this.hostElement.contains(relatedTarget)) return;\n        this.open = false;\n    };\n\n    handleKeydown = async (event: KeyboardEvent) => {\n        const isTabMetaOrCtrl = event.metaKey || event.ctrlKey || event.key === 'Tab';\n        if (!this.optionCount || this.disabled || isTabMetaOrCtrl) return;\n        event.preventDefault();\n        const hasSlot = this.hasPopoverTop || this.hasPopoverBottom;\n\n        // slots are incompatible with action sheet\n        if (shouldShowActionSheet(this, event) && !hasSlot) {\n            this.executeActionSheet(event);\n        } else {\n            this.handleOptionListExternalKeydown(event);\n        }\n    };\n\n    // for spec testing\n    handleOptionListExternalKeydown = async (event: KeyboardEvent) => {\n        await this.optionList?.handleExternalKeydown(event);\n    };\n\n    handleSelectionChanges = async (changeDetails: { value?: string; values?: OptionValue[] }) => {\n        const { multiple } = this;\n        const { value = '', values = [] } = changeDetails;\n        const isActive = multiple ? !!values.length : !!value;\n        if (!this.hostElement.onchange) {\n            if (multiple) {\n                this.selectedOptions = values;\n                this.value = undefined;\n            } else {\n                const selectedOption = (await this.getOption(value)) as HTMLQ2OptionElement;\n                this.selectedOptions = selectedOption\n                    ? [{ value: selectedOption.value, display: selectedOption.display }]\n                    : [];\n                this.value = selectedOption?.value || undefined;\n            }\n        }\n\n        mirrorEmit(this, ['change', 'tctChange'], {\n            value: multiple ? undefined : value,\n            values,\n            active: isActive,\n        });\n    };\n\n    handleWrapperClick = () => {\n        this.primaryBtn.focus();\n        this.primaryBtn.click();\n    };\n\n    onClickElsewhere = (event: CustomEvent) => {\n        const target = event.target as HTMLClickElsewhereElement;\n        if (target.localName === 'click-elsewhere') {\n            event.stopPropagation();\n            const { popoverElement } = this;\n            if (!popoverElement) return;\n            popoverElement.open = false;\n        }\n    };\n\n    onMutationObserved = () => {\n        this.updateSlotState();\n        this.determineOptionCount();\n        this.updateSelectedOptionElements();\n    };\n\n    onPopoverState = (event: CustomEvent<{ open: boolean; action: 'close' | 'select' | 'open' }>) => {\n        const { open, action } = event.detail;\n        if (open) return;\n\n        switch (action) {\n            case 'select':\n            case 'close':\n                this.primaryBtn.focus();\n                break;\n        }\n    };\n\n    // for spec testing\n    setOptionListActiveElement = async (index: number) => {\n        await this.optionList?.setActiveElement(index);\n    };\n\n    syncValueProperties = () => {\n        const { value, selectedOptions } = this;\n        if (!!selectedOptions?.length) this.selectedOptionsChanged(selectedOptions);\n        else if (value) this.valueChanged(value, null, 'value');\n    };\n\n    updateSelectedOptionElements = async () => {\n        const { selectedOptions = [] } = this;\n        const selectedValues = selectedOptions.map(option => option.value);\n        const options = await this.getOptionListOptions();\n        if (this.optionCount) this.active = !!selectedValues.length;\n        this.selectedOptionElements =\n            (options?.filter(option => selectedValues.includes(option.value)) as HTMLQ2OptionElement[]) || [];\n    };\n\n    updateSlotState = () => {\n        const { hostElement, hasPopoverTop, hasPopoverBottom } = this;\n        const popTopSlot = hostElement.shadowRoot.querySelector<HTMLSlotElement>('slot[name=\"popover-top\"]');\n        const popBottomSlot = hostElement.shadowRoot.querySelector<HTMLSlotElement>('slot[name=\"popover-bottom\"]');\n        const topSlotHasNode = popTopSlot?.assignedNodes().length > 0;\n        const bottomSlotHasNode = popBottomSlot?.assignedNodes().length > 0;\n\n        if (hasPopoverTop !== topSlotHasNode) this.hasPopoverTop = topSlotHasNode;\n        if (hasPopoverBottom !== bottomSlotHasNode) this.hasPopoverBottom = bottomSlotHasNode;\n    };\n\n    // #endregion\n    // #region Render Methods\n\n    renderHiddenElement() {\n        return (\n            <div\n                id=\"option-description\"\n                class=\"sr\"\n                aria-hidden=\"true\"\n            >\n                {loc('tecton.element.optionList.optionCount', [this.optionCount])}\n            </div>\n        );\n    }\n\n    renderIcon() {\n        const { optionCount, active } = this;\n        const isButton = optionCount && active;\n        const TagName = isButton ? 'button' : 'div';\n        const iconName = isButton || !optionCount ? 'close' : 'chevron-down';\n\n        return (\n            <TagName\n                class=\"btn-close\"\n                onClick={(isButton && this.clearSelectedOptions) || undefined}\n                disabled={(isButton && this.disabled) || undefined}\n                aria-label={(isButton && loc('tecton.element.pill.clearSelection')) || undefined}\n                type={(isButton && 'button') || undefined}\n            >\n                <q2-icon type={iconName}></q2-icon>\n            </TagName>\n        );\n    }\n\n    render() {\n        const { optionCount, active, open } = this;\n        const { text, truncatedText } = this.buttonContent;\n        const wrapperClassNames = ['btn-wrapper'];\n        if (optionCount || active) wrapperClassNames.push('has-icon');\n        if (optionCount) wrapperClassNames.push('has-options');\n\n        return (\n            <click-elsewhere onChange={this.onClickElsewhere}>\n                <div class={wrapperClassNames.join(' ')}>\n                    <div\n                        class=\"btn-height-wrapper\"\n                        ref={el => (this.primaryBtnWrapper = el)}\n                        onClick={this.handleWrapperClick}\n                        tabIndex={-1}\n                    >\n                        <button\n                            class=\"btn-primary\"\n                            test-id=\"btn-control\"\n                            type=\"button\"\n                            role={(optionCount && 'combobox') || undefined}\n                            ref={el => (this.primaryBtn = el)}\n                            onClick={this.handleClick}\n                            onKeyDown={this.handleKeydown}\n                            onFocusout={this.handleFocusOut}\n                            disabled={this.disabled}\n                            aria-roledescription={!optionCount && 'filter'}\n                            aria-controls={(optionCount && 'option-list') || undefined}\n                            aria-expanded={(optionCount && `${!!open}`) || undefined}\n                            aria-label={text}\n                            aria-pressed={!optionCount ? `${!!active}` : undefined}\n                            aria-describedby={(optionCount && 'option-description') || undefined}\n                        >\n                            {truncatedText}\n                        </button>\n                    </div>\n                    {this.renderIcon()}\n                    {!!optionCount && this.renderHiddenElement()}\n                </div>\n                {this.optionCount > 0 && (\n                    <q2-popover\n                        ref={el => (this.popoverElement = el)}\n                        controlElement={this.primaryBtn}\n                        open={this.open}\n                        max-height={this.popoverMaxHeight}\n                        minHeight={this.popoverMinHeight}\n                        direction={this.popoverDirection}\n                        align={this.popoverAlignment}\n                        onFocusout={this.handleFocusOut}\n                    >\n                        <div class=\"popover-content\">\n                            <div\n                                ref={el => (this.popoverTopContainer = el)}\n                                class=\"popover-top-container\"\n                                tabindex=\"-1\"\n                                hidden={!this.hasPopoverTop}\n                                onKeyDown={this.handleKeydown}\n                            >\n                                <slot name=\"popover-top\"></slot>\n                            </div>\n                            <q2-option-list\n                                type=\"listbox\"\n                                ref={el => (this.optionList = el)}\n                                id=\"option-list\"\n                                onChange={this.handleChange}\n                                multiple={this.multiple}\n                                selectedOptions={this.selectedOptions}\n                                onReady={() => this.updateSelectedOptionElements()}\n                                onPopoverState={this.onPopoverState}\n                                label={loc('tecton.element.optionList.label', [this.optionListLabel])}\n                            >\n                                <slot />\n                            </q2-option-list>\n                            <div\n                                ref={el => (this.popoverBottomContainer = el)}\n                                class=\"popover-bottom-container\"\n                                tabindex=\"-1\"\n                                hidden={!this.hasPopoverBottom}\n                                onKeyDown={this.handleKeydown}\n                            >\n                                <slot name=\"popover-bottom\"></slot>\n                            </div>\n                        </div>\n                    </q2-popover>\n                )}\n            </click-elsewhere>\n        );\n    }\n\n    // #endregion\n}\n"]}

package/dist/collection/components/q2-pill/test/q2-pill-test.vr.js

@@ -0,0 +1,110 @@
+import { expect } from "@playwright/test";
+import { test } from "@stencil/playwright";
+import { setupPage, THEMES } from "../../../utils/test/vr-helpers";
+const OPTIONS = `
+    <q2-option value="1">Option 1</q2-option>
+    <q2-option value="2">Option 2</q2-option>
+    <q2-option value="3">Option 3</q2-option>
+`;
+const THEME_VALUES = ['default', 'primary', 'secondary', 'tertiary'];
+const themeAttr = (theme) => (theme === 'default' ? '' : ` theme="${theme}"`);
+const VARIANTS = [
+    // "Default" — the bare example with its own option children shown in index.html
+    {
+        name: 'default',
+        html: `<q2-pill label="My pill">${OPTIONS}</q2-pill>`,
+    },
+    // Themes × active (with value=2 selected)
+    ...THEME_VALUES.map(t => ({
+        name: `theme-${t}-active`,
+        html: `<q2-pill label="My pill" value="2"${themeAttr(t)} active></q2-pill>`,
+    })),
+    // Borderless × themes × active
+    ...THEME_VALUES.map(t => ({
+        name: `borderless-${t}-active`,
+        html: `<q2-pill label="My pill" value="2"${themeAttr(t)} borderless active></q2-pill>`,
+    })),
+    // Disabled × themes × active
+    ...THEME_VALUES.map(t => ({
+        name: `disabled-${t}-active`,
+        html: `<q2-pill label="My pill" value="2"${themeAttr(t)} disabled active></q2-pill>`,
+    })),
+];
+// Uses popover-alignment=left so the dropdown extends rightward into the viewport
+// rather than leftward off-screen (pill sits at x=0).
+const EXPANDED_VARIANT = {
+    name: 'default',
+    html: `<q2-pill label="My pill" popover-alignment="left">${OPTIONS}</q2-pill>`,
+};
+// Focus targets: inactive default + one active per pill theme.
+const FOCUS_VARIANTS = [
+    { name: 'default-inactive', html: `<q2-pill label="My pill"></q2-pill>` },
+    ...THEME_VALUES.map(t => ({
+        name: `theme-${t}-active`,
+        html: `<q2-pill label="My pill" value="2"${themeAttr(t)} active></q2-pill>`,
+    })),
+];
+// "With options" pills rendered per pill theme. Each has options pre-selected (value=2)
+// which exposes a shadow-DOM close button (button.btn-close) that clears the selection.
+const WITH_OPTIONS_VARIANTS = THEME_VALUES.map(t => ({
+    name: `with-options-${t}`,
+    html: `<q2-pill label="My pill" value="2"${themeAttr(t)}>${OPTIONS}</q2-pill>`,
+}));
+const restingCase = (variant, theme) => {
+    test(`q2-pill--${variant.name}--resting — ${theme}`, async ({ page }) => {
+        await setupPage(page, variant.html, { theme });
+        await expect(page).toHaveScreenshot(`q2-pill--${variant.name}--resting--${theme}.png`);
+    });
+};
+const expandedCase = (variant, theme) => {
+    test(`q2-pill--${variant.name}--expanded — ${theme}`, async ({ page }) => {
+        await setupPage(page, variant.html, { theme });
+        await page
+            .locator('q2-pill')
+            .evaluate((el) => el.openPopover());
+        await page.locator('q2-option[value="1"]').waitFor({ state: 'visible' });
+        await expect(page).toHaveScreenshot(`q2-pill--${variant.name}--expanded--${theme}.png`);
+    });
+};
+const focusCase = (variant, theme) => {
+    test(`q2-pill--${variant.name}--focus — ${theme}`, async ({ page }) => {
+        await setupPage(page, variant.html, { theme });
+        await page.keyboard.press('Tab');
+        await expect(page).toHaveScreenshot(`q2-pill--${variant.name}--focus--${theme}.png`);
+    });
+};
+// Focus the shadow-DOM close button (button.btn-close) on a with-options pill.
+const closeBtnFocusCase = (variant, theme) => {
+    test(`q2-pill--${variant.name}--close-btn-focus — ${theme}`, async ({ page }) => {
+        await setupPage(page, variant.html, { theme });
+        await page.locator('q2-pill').evaluate((el) => {
+            var _a;
+            const btn = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('button.btn-close');
+            if (!btn)
+                throw new Error('q2-pill close button not found in shadow DOM');
+            btn.focus();
+        });
+        await expect(page).toHaveScreenshot(`q2-pill--${variant.name}--close-btn-focus--${theme}.png`);
+    });
+};
+test.describe('q2-pill — variants × themes', () => {
+    for (const variant of VARIANTS) {
+        for (const theme of THEMES) {
+            restingCase(variant, theme);
+        }
+    }
+    for (const theme of THEMES) {
+        expandedCase(EXPANDED_VARIANT, theme);
+    }
+    for (const variant of FOCUS_VARIANTS) {
+        for (const theme of THEMES) {
+            focusCase(variant, theme);
+        }
+    }
+    for (const variant of WITH_OPTIONS_VARIANTS) {
+        for (const theme of THEMES) {
+            closeBtnFocusCase(variant, theme);
+        }
+    }
+});
+//# sourceMappingURL=q2-pill-test.vr.js.map

package/dist/collection/components/q2-pill/test/q2-pill-test.vr.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"q2-pill-test.vr.js","sourceRoot":"","sources":["../../../../../src/components/q2-pill/test/q2-pill-test.vr.ts"],"names":[],"mappings":"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","sourcesContent":["import { expect } from '@playwright/test';\nimport { test } from '@stencil/playwright';\nimport { setupPage, THEMES, Theme } from '../../../utils/test/vr-helpers';\n\ntype Variant = { name: string; html: string };\n\nconst OPTIONS = `\n    <q2-option value=\"1\">Option 1</q2-option>\n    <q2-option value=\"2\">Option 2</q2-option>\n    <q2-option value=\"3\">Option 3</q2-option>\n`;\n\nconst THEME_VALUES = ['default', 'primary', 'secondary', 'tertiary'] as const;\ntype PillTheme = (typeof THEME_VALUES)[number];\n\nconst themeAttr = (theme: PillTheme) => (theme === 'default' ? '' : ` theme=\"${theme}\"`);\n\nconst VARIANTS: Variant[] = [\n    // \"Default\" — the bare example with its own option children shown in index.html\n    {\n        name: 'default',\n        html: `<q2-pill label=\"My pill\">${OPTIONS}</q2-pill>`,\n    },\n    // Themes × active (with value=2 selected)\n    ...THEME_VALUES.map(t => ({\n        name: `theme-${t}-active`,\n        html: `<q2-pill label=\"My pill\" value=\"2\"${themeAttr(t)} active></q2-pill>`,\n    })),\n    // Borderless × themes × active\n    ...THEME_VALUES.map(t => ({\n        name: `borderless-${t}-active`,\n        html: `<q2-pill label=\"My pill\" value=\"2\"${themeAttr(t)} borderless active></q2-pill>`,\n    })),\n    // Disabled × themes × active\n    ...THEME_VALUES.map(t => ({\n        name: `disabled-${t}-active`,\n        html: `<q2-pill label=\"My pill\" value=\"2\"${themeAttr(t)} disabled active></q2-pill>`,\n    })),\n];\n\n// Uses popover-alignment=left so the dropdown extends rightward into the viewport\n// rather than leftward off-screen (pill sits at x=0).\nconst EXPANDED_VARIANT: Variant = {\n    name: 'default',\n    html: `<q2-pill label=\"My pill\" popover-alignment=\"left\">${OPTIONS}</q2-pill>`,\n};\n\n// Focus targets: inactive default + one active per pill theme.\nconst FOCUS_VARIANTS: Variant[] = [\n    { name: 'default-inactive', html: `<q2-pill label=\"My pill\"></q2-pill>` },\n    ...THEME_VALUES.map(t => ({\n        name: `theme-${t}-active`,\n        html: `<q2-pill label=\"My pill\" value=\"2\"${themeAttr(t)} active></q2-pill>`,\n    })),\n];\n\n// \"With options\" pills rendered per pill theme. Each has options pre-selected (value=2)\n// which exposes a shadow-DOM close button (button.btn-close) that clears the selection.\nconst WITH_OPTIONS_VARIANTS: Variant[] = THEME_VALUES.map(t => ({\n    name: `with-options-${t}`,\n    html: `<q2-pill label=\"My pill\" value=\"2\"${themeAttr(t)}>${OPTIONS}</q2-pill>`,\n}));\n\nconst restingCase = (variant: Variant, theme: Theme) => {\n    test(`q2-pill--${variant.name}--resting — ${theme}`, async ({ page }) => {\n        await setupPage(page, variant.html, { theme });\n        await expect(page).toHaveScreenshot(`q2-pill--${variant.name}--resting--${theme}.png`);\n    });\n};\n\nconst expandedCase = (variant: Variant, theme: Theme) => {\n    test(`q2-pill--${variant.name}--expanded — ${theme}`, async ({ page }) => {\n        await setupPage(page, variant.html, { theme });\n        await page\n            .locator('q2-pill')\n            .evaluate((el: HTMLElement & { openPopover(): Promise<void> }) => el.openPopover());\n        await page.locator('q2-option[value=\"1\"]').waitFor({ state: 'visible' });\n        await expect(page).toHaveScreenshot(`q2-pill--${variant.name}--expanded--${theme}.png`);\n    });\n};\n\nconst focusCase = (variant: Variant, theme: Theme) => {\n    test(`q2-pill--${variant.name}--focus — ${theme}`, async ({ page }) => {\n        await setupPage(page, variant.html, { theme });\n        await page.keyboard.press('Tab');\n        await expect(page).toHaveScreenshot(`q2-pill--${variant.name}--focus--${theme}.png`);\n    });\n};\n\n// Focus the shadow-DOM close button (button.btn-close) on a with-options pill.\nconst closeBtnFocusCase = (variant: Variant, theme: Theme) => {\n    test(`q2-pill--${variant.name}--close-btn-focus — ${theme}`, async ({ page }) => {\n        await setupPage(page, variant.html, { theme });\n        await page.locator('q2-pill').evaluate((el: HTMLElement) => {\n            const btn = el.shadowRoot?.querySelector<HTMLButtonElement>('button.btn-close');\n            if (!btn) throw new Error('q2-pill close button not found in shadow DOM');\n            btn.focus();\n        });\n        await expect(page).toHaveScreenshot(`q2-pill--${variant.name}--close-btn-focus--${theme}.png`);\n    });\n};\n\ntest.describe('q2-pill — variants × themes', () => {\n    for (const variant of VARIANTS) {\n        for (const theme of THEMES) {\n            restingCase(variant, theme);\n        }\n    }\n    for (const theme of THEMES) {\n        expandedCase(EXPANDED_VARIANT, theme);\n    }\n    for (const variant of FOCUS_VARIANTS) {\n        for (const theme of THEMES) {\n            focusCase(variant, theme);\n        }\n    }\n    for (const variant of WITH_OPTIONS_VARIANTS) {\n        for (const theme of THEMES) {\n            closeBtnFocusCase(variant, theme);\n        }\n    }\n});\n"]}

package/dist/collection/components/q2-popover/q2-popover.css

@@ -65,6 +65,26 @@ button {
   visibility: hidden;
 }
 
+/**
+ * @prop --tct-popover-background: (<color>) Controls the background color of the popover.
+ * @prop --tct-popover-font-color: (<color>) Controls the text color of the popover content.
+ * @prop --tct-popover-backdrop-filter?: (*) Controls the optional backdrop-filter applied to the popover.
+ * @prop --tct-popover-box-shadow: (*) Controls the box shadow of the popover.
+ * @prop --tct-popover-border-color?: (<color>) Controls the optional border color of the popover.
+ * @prop --tct-popover-border-width?: (<length>+) Controls the optional border width of the popover.
+ * @prop --tct-popover-border-radius?: (<length-percentage>) Controls the optional corner radius of the popover.
+ * @prop --tct-popover-padding?: (<length-percentage>+) Controls the optional inner padding of the popover.
+ * @prop --tct-popover-margin-block?: (<length-percentage>+) Controls the optional block-axis margin of the popover.
+ * @prop --tct-popover-min-width: (<length-percentage>) Controls the minimum width of the popover.
+ * @prop --tct-popover-top: (<length-percentage>) Controls the top offset of the popover when opening downward.
+ * @prop --tct-popover-z-index: (<integer>) Controls the z-index of the legacy popover element.
+ * @prop --tct-popover-open-animation-duration: (<time>) Controls the duration of the popover open animation.
+ * @prop --tct-popover-open-animation-fill-mode: (<custom-ident>) Controls the animation-fill-mode of the popover open animation.
+ * @prop --tct-popover-open-animation-timing-function: (*) Controls the animation timing function of the popover open animation.
+ * @prop --tct-popover-close-animation-duration: (<time>) Controls the duration of the popover close animation.
+ * @prop --tct-popover-close-animation-fill-mode: (<custom-ident>) Controls the animation-fill-mode of the popover close animation.
+ * @prop --tct-popover-close-animation-timing-function: (*) Controls the animation timing function of the popover close animation.
+ */
 .legacy.container {
   display: none;
 }

package/dist/collection/components/q2-popover/q2-popover.js

@@ -194,6 +194,7 @@ export class Q2Popover {
         this.handleMinHeight();
     }
     async openChanged(open) {
+        var _a;
         mirrorEmit(this, ['popoverStateChanged', 'tctPopoverStateChanged'], { open });
         if (open) {
             this.animationState = 'opening';
@@ -216,6 +217,8 @@ export class Q2Popover {
                 this.pendingAnimationResolve = handleAnimationEnd;
                 this.containerElement.addEventListener('animationend', handleAnimationEnd, { once: true });
             });
+            if (this.open)
+                return;
             if (!this.containerElement)
                 return;
             if (this.open)
@@ -226,7 +229,7 @@ export class Q2Popover {
                 this.show = false;
             }
             else {
-                this.containerElement.hidePopover();
+                (_a = this.containerElement) === null || _a === void 0 ? void 0 : _a.hidePopover();
             }
             await waitForNextPaint();
             this.clearCSSProperties();
@@ -384,7 +387,7 @@ export class Q2Popover {
             containerClasses.push('animating-open');
         if (this.animationState === 'closing')
             containerClasses.push('animating-close');
-        return (h("div", { key: '32b8669d138922c8229232cbeffc24c12142a603', ref: el => (this.containerElement = el), class: containerClasses.join(' '), "test-id": "outerContainer", tabIndex: -1, popover: "manual" }, h("div", { key: 'c4a9582bcf7ed063aadd40a214606d32b406f05f', ref: el => (this.contentElement = el), class: "content" }, h("slot", { key: 'e64707b4b54de39c9d9a487e4bdc6d4d5ca8b16f' }))));
+        return (h("div", { key: '4e167b9b7cd781936214e26f1bb1877816c539ad', ref: el => (this.containerElement = el), class: containerClasses.join(' '), "test-id": "outerContainer", tabIndex: -1, popover: "manual" }, h("div", { key: '6dfd13872cebe82c68d3f7282486b0d9d7e016bd', ref: el => (this.contentElement = el), class: "content" }, h("slot", { key: 'c682610288f06eaa2944fc5f0bef7a0eb145509d' }))));
     }
     static get is() { return "q2-popover"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/q2-popover/q2-popover.js.map

@@ -1 +1 @@
-{"version":3,"file":"q2-popover.js","sourceRoot":"","sources":["../../../../src/components/q2-popover/q2-popover.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n    Component,\n    Prop,\n    h,\n    ComponentInterface,\n    Element,\n    Watch,\n    Method,\n    Listen,\n    EventEmitter,\n    Event,\n    State,\n} from '@stencil/core';\nimport { handleDeprecationWarning, waitForNextPaint, isMobile, isInScrollableContainer } from '../../utils';\nimport mirrorEmit from '@/utils/mirror-emit';\n\n/**\n * ***********\n * * WARNING *\n * ***********\n * Touching this file obligates you to manually test thoroughly, because Puppeteer can't capture every edgecase.\n *\n * Each of the following Scenarios must be tested on each Device, in each Environment.\n *\n * Scenarios:\n * - Q2 Select searchable\n * - Q2 Select non-searchable\n *\n * Orientations:\n * - Portrait\n * - Landscape\n *\n * Devices:\n * - iOS Safari\n * - Android Chrome\n * - MacOS Safari\n * - Chrome\n * - Firefox\n *\n * Environments:\n * - Standard (Outside of Iframe)\n * - SDK Extension (Inside of Iframe)\n */\n\n/**\n * @name Popover\n * @category Display\n * @summary Use for positioning floating content relative to a trigger element.\n */\n@Component({ tag: 'q2-popover', shadow: true, styleUrl: 'q2-popover.scss' })\nexport class Q2Popover implements ComponentInterface {\n    // #region Own Properties\n\n    containerElement: HTMLDivElement;\n    contentElement: HTMLDivElement;\n    /**\n     * The number of pixels to leave between the popover and the edge of the viewport\n     */\n    displayBuffer = 10;\n    orientationChanged: boolean = false;\n    pendingAnimationResolve: (() => void) | null = null;\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    animationState: 'idle' | 'opening' | 'closing' = 'idle';\n\n    @State()\n    currentDirection: 'down' | 'up' = undefined;\n\n    // remove `show` when we transitiong fully to Popover API and get rid of 'legacy' mode\n    @State()\n    show: boolean = false;\n\n    // #endregion\n    // #region Public Property API\n\n    /** Aligns the popover to the left or right side of the control element. */\n    @Prop({ reflect: true })\n    align: 'left' | 'right' = 'left';\n\n    /** Indicates the popover will match the width of its parent element. */\n    @Prop({ reflect: true })\n    block: boolean;\n\n    /** The element that controls the popover's behavior. */\n    @Prop()\n    controlElement: HTMLElement;\n\n    /**\n     * Force the direction of the popover when it opens.\n     * If no value is passed, the component will auto-detect the direction based on available space.\n     */\n    @Prop({ reflect: true })\n    direction: 'up' | 'down';\n\n    /**\n     * Force the maximum height of the popover. This value will be interpreted as pixels.\n     * If no value is passed, or the value exceeds available space, the component will auto-detect the maximum height based on available space.\n     */\n    @Prop()\n    maxHeight: number;\n\n    /** @deprecated */\n    @Prop()\n    minHeight: number;\n\n    @Prop()\n    mode: 'legacy' = null;\n\n    /** Controls whether the popover is open or closed. */\n    @Prop({ reflect: true, mutable: true })\n    open: boolean;\n\n    // #endregion\n    // #region Events\n\n    /**\n     * Emitted when the popover is opened or closed.\n     * @deprecated Use 'tctPopoverStateChanged' instead\n     */\n    @Event()\n    popoverStateChanged: EventEmitter<{ open: boolean }>;\n\n    /**\n     * Emitted when the popover is opened or closed.\n     */\n    @Event()\n    tctPopoverStateChanged: EventEmitter<{ open: boolean }>;\n\n    // #endregion\n    // #region Component Lifecycle Events\n\n    disconnectedCallback() {\n        this.removeViewportListeners();\n        if (this.pendingAnimationResolve) {\n            this.pendingAnimationResolve();\n            this.pendingAnimationResolve = null;\n        }\n        this.containerElement?.removeEventListener('toggle', this.handlePopoverToggleEvent);\n        this.containerElement = null;\n        this.contentElement = null;\n        this.controlElement = null;\n    }\n\n    componentWillLoad() {\n        if (!this.supportsPopoverAPI) {\n            console.warn(\n                'The Popover API is not supported in this browser. Please update your browser to the latest version. The component will use legacy mode.'\n            );\n            this.mode = 'legacy';\n        }\n    }\n\n    componentDidLoad() {\n        this.handleMinHeight();\n        if (this.supportsPopoverAPI) this.containerElement?.addEventListener('toggle', this.handlePopoverToggleEvent);\n        if (this.open) this.determinePopDirection();\n    }\n\n    // #endregion\n    // #region Listeners\n\n    @Listen('popoverState')\n    popoverStateHandler(event: CustomEvent<{ open: boolean }>) {\n        const {\n            detail: { open },\n        } = event;\n        if (open === this.open) return;\n\n        this.open = open;\n        event.stopPropagation();\n    }\n\n    // #endregion\n    // #region Public Methods API\n\n    @Method()\n    async scrollContainerTo(options: ScrollToOptions) {\n        this.containerElement?.scrollTo(options);\n    }\n\n    @Method()\n    async toggle() {\n        this.open = !this.open;\n    }\n\n    // #endregion\n    // #region Watchers\n\n    @Watch('minHeight')\n    minHeightProvided() {\n        this.handleMinHeight();\n    }\n\n    @Watch('open')\n    async openChanged(open: boolean) {\n        mirrorEmit(this, ['popoverStateChanged', 'tctPopoverStateChanged'], { open });\n\n        if (open) {\n            this.animationState = 'opening';\n            this.addViewportListeners();\n            this.determinePopDirection();\n        } else {\n            this.animationState = 'closing';\n            this.removeViewportListeners();\n\n            // Wait for close animation to complete\n            await new Promise<void>(resolve => {\n                if (!this.containerElement) {\n                    resolve();\n                    return;\n                }\n                const handleAnimationEnd = () => {\n                    this.pendingAnimationResolve = null;\n                    resolve();\n                };\n                this.pendingAnimationResolve = handleAnimationEnd;\n                this.containerElement.addEventListener('animationend', handleAnimationEnd, { once: true });\n            });\n\n            if (!this.containerElement) return;\n            if (this.open) return;\n\n            this.currentDirection = undefined;\n            this.animationState = 'idle';\n            if (this.mode === 'legacy' || !this.supportsPopoverAPI) {\n                this.show = false;\n            } else {\n                this.containerElement.hidePopover();\n            }\n\n            await waitForNextPaint();\n            this.clearCSSProperties();\n        }\n    }\n\n    // #endregion\n    // #region Local Methods\n\n    get isModule(): boolean {\n        const isIframe = window !== window.top;\n        const hasPlatformDimensions = Object.keys(window.Tecton?.platformDimensions ?? {}).length > 0;\n        return isIframe && hasPlatformDimensions;\n    }\n\n    get providedDirection(): 'up' | 'down' | undefined {\n        const { direction } = this;\n        switch (direction) {\n            case 'up':\n            case 'down':\n                return direction;\n            default:\n                return undefined;\n        }\n    }\n\n    get supportsPopoverAPI(): boolean {\n        return Object.hasOwn(HTMLElement.prototype, 'popover');\n    }\n\n    get validatedMaxHeight(): number | undefined {\n        const { maxHeight } = this;\n        return isNaN(maxHeight) ? undefined : maxHeight;\n    }\n\n    addViewportListeners() {\n        window.addEventListener('resize', this.viewPortOrientationChanged);\n        visualViewport?.addEventListener('resize', this.viewPortChanged);\n        if (isInScrollableContainer(this.hostElement) && !isMobile()) {\n            window.addEventListener('scroll', this.viewPortChanged, { passive: true, capture: true });\n        }\n        screen?.orientation?.addEventListener('orientationchange', this.viewPortOrientationChanged);\n        window.addEventListener('orientationchange', this.viewPortOrientationChanged);\n    }\n\n    clearCSSProperties() {\n        if (!this.containerElement) return;\n        this.containerElement.style.removeProperty('--comp-pop-max-height');\n        this.containerElement.style.removeProperty('--comp-pop-top');\n        this.containerElement.style.removeProperty('--comp-pop-bottom');\n        this.containerElement.style.removeProperty('--comp-pop-left');\n        this.containerElement.style.removeProperty('--comp-pop-right');\n        this.containerElement.style.removeProperty('--comp-pop-width');\n        this.containerElement.style.removeProperty('--comp-pop-opacity');\n    }\n\n    async determinePopDirection() {\n        const { containerElement, controlElement, providedDirection, displayBuffer } = this;\n        if (containerElement) containerElement.style.maxHeight = null;\n        await waitForNextPaint();\n        if (!this.containerElement) return;\n\n        const { isModule } = this;\n        const { top: controlTop, bottom: controlBottom } = controlElement?.getBoundingClientRect?.() ?? {\n            top: 0,\n            bottom: 0,\n        };\n\n        let windowHeight: number;\n        let maxSpaceAbove: number;\n        let maxSpaceBelow: number;\n        const isScrollableIframe = isModule && isInScrollableContainer(this.hostElement);\n        if (isModule && !isScrollableIframe) {\n            const {\n                outletOffset = 0,\n                innerHeight = window.innerHeight,\n                top: topBarHeight = 0,\n                bottom: bottomBarHeight = 0,\n            } = window.Tecton?.platformDimensions || {};\n\n            const distanceToIframeBottom = window.innerHeight - controlBottom;\n\n            // controlElement position visually on the page\n            const visualControlTop = outletOffset > 0 ? controlTop : controlTop + outletOffset - topBarHeight;\n            const visualControlBottom = outletOffset + controlBottom - topBarHeight;\n\n            // visual space around the controlElement\n            const viewableSpaceAbove = visualControlTop;\n            const viewableSpaceBelow = innerHeight - bottomBarHeight - visualControlBottom;\n\n            // calculate space above and below controlElement\n            const isIframeShorterThanWindow = distanceToIframeBottom < viewableSpaceBelow;\n            maxSpaceAbove = viewableSpaceAbove - displayBuffer;\n            maxSpaceBelow = isIframeShorterThanWindow\n                ? distanceToIframeBottom - displayBuffer\n                : viewableSpaceBelow - displayBuffer;\n        } else {\n            windowHeight = window.innerHeight;\n            maxSpaceAbove = controlTop - displayBuffer;\n            maxSpaceBelow = windowHeight - controlBottom - displayBuffer;\n        }\n\n        const directionWithMostSpace: 'up' | 'down' = maxSpaceAbove > maxSpaceBelow ? 'up' : 'down';\n\n        // We do not want to update the max height once the popover is open unless the page orientation shifts (resize or mobile use cases)\n        const shouldUpdateMaxHeight =\n            !containerElement?.style.getPropertyValue('--comp-pop-max-height') || this.orientationChanged;\n        // we do not want to constantly update the max-height after an orientation change, so we switch this back to false\n        this.orientationChanged = false;\n        const currentOrDetermineDirection = this.currentDirection || providedDirection || directionWithMostSpace;\n\n        switch (currentOrDetermineDirection) {\n            case 'up':\n                if (shouldUpdateMaxHeight && containerElement) {\n                    const priorityMaxHeight = this.validatedMaxHeight || maxSpaceAbove;\n                    const maxHeight = Math.min(maxSpaceAbove, priorityMaxHeight);\n                    containerElement.style.setProperty('--comp-pop-max-height', `${maxHeight}px`);\n                }\n                this.setDirectionAndShow('up');\n                break;\n            case 'down':\n                if (shouldUpdateMaxHeight && containerElement) {\n                    const priorityMaxHeight = this.validatedMaxHeight || maxSpaceBelow;\n                    const maxHeight = Math.min(maxSpaceBelow, priorityMaxHeight);\n                    containerElement.style.setProperty('--comp-pop-max-height', `${maxHeight}px`);\n                }\n                this.setDirectionAndShow('down');\n                break;\n            default:\n                break;\n        }\n    }\n\n    handleMinHeight = () => {\n        if (this.minHeight) {\n            handleDeprecationWarning(this, 'minHeight', 'prop');\n        }\n    };\n\n    handlePopoverToggleEvent = (event: ToggleEvent) => {\n        mirrorEmit(this, ['popoverStateChanged', 'tctPopoverStateChanged'], { open: event.newState === 'open' });\n    };\n\n    removeViewportListeners() {\n        window.removeEventListener('resize', this.viewPortOrientationChanged);\n        visualViewport?.removeEventListener('resize', this.viewPortChanged);\n        window.removeEventListener('scroll', this.viewPortChanged, { capture: true });\n        screen?.orientation?.removeEventListener('orientationchange', this.viewPortOrientationChanged);\n        window.removeEventListener('orientationchange', this.viewPortOrientationChanged);\n    }\n\n    setAbsoluteCSSProperties = async () => {\n        const { controlElement, containerElement, currentDirection, align } = this;\n        if (!containerElement) return;\n\n        if (align === 'right') {\n            containerElement.style.setProperty('--comp-pop-right', '0');\n            containerElement.style.setProperty('--comp-pop-left', 'unset');\n        } else {\n            containerElement.style.setProperty('--comp-pop-left', '0');\n            containerElement.style.setProperty('--comp-pop-right', 'unset');\n        }\n\n        if (this.block) {\n            containerElement.style.setProperty('--comp-pop-width', '100%');\n        }\n\n        if (currentDirection === 'up') {\n            const controlStyle = getComputedStyle(controlElement);\n            const controlSize =\n                parseInt(controlStyle.height || '0') +\n                parseInt(controlStyle.borderTopWidth || '0') +\n                parseInt(controlStyle.borderBottomWidth || '0');\n\n            containerElement.style.setProperty('--comp-pop-bottom', `${controlSize}px`);\n        }\n\n        // Wait for one paint to prevent layout thrashing\n        await waitForNextPaint();\n        if (this.containerElement) containerElement.style.setProperty('--comp-pop-opacity', '1');\n    };\n\n    setDirectionAndShow(direction: 'up' | 'down') {\n        // Due to some runtime inconsistency across devices/browsers we need to add one more check here because the\n        // popover can be closed between the time the popover is opened and the time the direction is determined\n        const isOpen = this.open;\n        if (!isOpen || !this.containerElement) return;\n\n        this.currentDirection = direction;\n        if (this.mode === 'legacy' || !this.supportsPopoverAPI) {\n            this.show = true;\n            this.setAbsoluteCSSProperties();\n        } else {\n            this.setPopoverAPICSSProperties();\n            this.containerElement?.showPopover();\n        }\n    }\n\n    setPopoverAPICSSProperties = async () => {\n        const { controlElement, containerElement, currentDirection, isModule, align } = this;\n        if (!containerElement) return;\n        const {\n            top: controlTop,\n            bottom: controlBottom,\n            left: controlLeft,\n            right: controlRight,\n        } = controlElement?.getBoundingClientRect?.() ?? {\n            top: 0,\n            bottom: 0,\n            left: 0,\n            right: 0,\n        };\n\n        const popoverLeft: number = controlLeft;\n        const popoverRight: number = window?.visualViewport?.width - controlRight;\n\n        if (align === 'right') {\n            containerElement.style.setProperty('--comp-pop-right', `${popoverRight - window.scrollX}px`);\n            containerElement.style.setProperty('--comp-pop-left', 'unset');\n        } else {\n            containerElement.style.setProperty('--comp-pop-left', `${popoverLeft + window.scrollX}px`);\n            containerElement.style.setProperty('--comp-pop-right', 'unset');\n        }\n\n        if (this.block) containerElement.style.setProperty('--comp-pop-width', `${controlElement?.offsetWidth || 0}px`);\n\n        const isScrollableIframe = isModule && isInScrollableContainer(this.hostElement);\n\n        if (currentDirection === 'up') {\n            if (isModule && !isScrollableIframe) {\n                containerElement.style.setProperty('--comp-pop-bottom', `${window.innerHeight - controlTop}px`);\n            } else {\n                containerElement.style.setProperty(\n                    '--comp-pop-bottom',\n                    `${window.innerHeight - controlTop - window.scrollY}px`\n                );\n            }\n        }\n\n        if (currentDirection === 'down') {\n            if (isModule && !isScrollableIframe) {\n                containerElement.style.setProperty('--comp-pop-top', `${controlBottom}px`);\n            } else {\n                containerElement.style.setProperty('--comp-pop-top', `${controlBottom + window.scrollY}px`);\n            }\n        }\n\n        // Wait for one paint to prevent layout thrashing\n        await waitForNextPaint();\n        if (this.containerElement) containerElement.style.setProperty('--comp-pop-opacity', '1');\n    };\n\n    viewPortChanged = () => {\n        if (!this.open) return;\n        this.determinePopDirection();\n    };\n\n    viewPortOrientationChanged = () => {\n        this.orientationChanged = true;\n        this.viewPortChanged();\n    };\n\n    // #endregion\n    // #region Render Methods\n\n    render() {\n        const containerClasses = ['container', this.currentDirection, this.align];\n        if (isMobile()) containerClasses.push('mobile');\n        if (this.show) containerClasses.push('show');\n        if (this.block) containerClasses.push('block');\n        if (this.mode === 'legacy') containerClasses.push('legacy');\n        if (this.animationState === 'opening') containerClasses.push('animating-open');\n        if (this.animationState === 'closing') containerClasses.push('animating-close');\n\n        return (\n            <div\n                ref={el => (this.containerElement = el)}\n                class={containerClasses.join(' ')}\n                test-id=\"outerContainer\"\n                tabIndex={-1}\n                popover=\"manual\"\n            >\n                <div\n                    ref={el => (this.contentElement = el)}\n                    class=\"content\"\n                >\n                    <slot />\n                </div>\n            </div>\n        );\n    }\n\n    // #endregion\n}\n"]}
+{"version":3,"file":"q2-popover.js","sourceRoot":"","sources":["../../../../src/components/q2-popover/q2-popover.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n    Component,\n    Prop,\n    h,\n    ComponentInterface,\n    Element,\n    Watch,\n    Method,\n    Listen,\n    EventEmitter,\n    Event,\n    State,\n} from '@stencil/core';\nimport { handleDeprecationWarning, waitForNextPaint, isMobile, isInScrollableContainer } from '../../utils';\nimport mirrorEmit from '@/utils/mirror-emit';\n\n/**\n * ***********\n * * WARNING *\n * ***********\n * Touching this file obligates you to manually test thoroughly, because Puppeteer can't capture every edgecase.\n *\n * Each of the following Scenarios must be tested on each Device, in each Environment.\n *\n * Scenarios:\n * - Q2 Select searchable\n * - Q2 Select non-searchable\n *\n * Orientations:\n * - Portrait\n * - Landscape\n *\n * Devices:\n * - iOS Safari\n * - Android Chrome\n * - MacOS Safari\n * - Chrome\n * - Firefox\n *\n * Environments:\n * - Standard (Outside of Iframe)\n * - SDK Extension (Inside of Iframe)\n */\n\n/**\n * @name Popover\n * @category Display\n * @summary Use for positioning floating content relative to a trigger element.\n */\n@Component({ tag: 'q2-popover', shadow: true, styleUrl: 'q2-popover.scss' })\nexport class Q2Popover implements ComponentInterface {\n    // #region Own Properties\n\n    containerElement: HTMLDivElement;\n    contentElement: HTMLDivElement;\n    /**\n     * The number of pixels to leave between the popover and the edge of the viewport\n     */\n    displayBuffer = 10;\n    orientationChanged: boolean = false;\n    pendingAnimationResolve: (() => void) | null = null;\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    animationState: 'idle' | 'opening' | 'closing' = 'idle';\n\n    @State()\n    currentDirection: 'down' | 'up' = undefined;\n\n    // remove `show` when we transitiong fully to Popover API and get rid of 'legacy' mode\n    @State()\n    show: boolean = false;\n\n    // #endregion\n    // #region Public Property API\n\n    /** Aligns the popover to the left or right side of the control element. */\n    @Prop({ reflect: true })\n    align: 'left' | 'right' = 'left';\n\n    /** Indicates the popover will match the width of its parent element. */\n    @Prop({ reflect: true })\n    block: boolean;\n\n    /** The element that controls the popover's behavior. */\n    @Prop()\n    controlElement: HTMLElement;\n\n    /**\n     * Force the direction of the popover when it opens.\n     * If no value is passed, the component will auto-detect the direction based on available space.\n     */\n    @Prop({ reflect: true })\n    direction: 'up' | 'down';\n\n    /**\n     * Force the maximum height of the popover. This value will be interpreted as pixels.\n     * If no value is passed, or the value exceeds available space, the component will auto-detect the maximum height based on available space.\n     */\n    @Prop()\n    maxHeight: number;\n\n    /** @deprecated */\n    @Prop()\n    minHeight: number;\n\n    @Prop()\n    mode: 'legacy' = null;\n\n    /** Controls whether the popover is open or closed. */\n    @Prop({ reflect: true, mutable: true })\n    open: boolean;\n\n    // #endregion\n    // #region Events\n\n    /**\n     * Emitted when the popover is opened or closed.\n     * @deprecated Use 'tctPopoverStateChanged' instead\n     */\n    @Event()\n    popoverStateChanged: EventEmitter<{ open: boolean }>;\n\n    /**\n     * Emitted when the popover is opened or closed.\n     */\n    @Event()\n    tctPopoverStateChanged: EventEmitter<{ open: boolean }>;\n\n    // #endregion\n    // #region Component Lifecycle Events\n\n    disconnectedCallback() {\n        this.removeViewportListeners();\n        if (this.pendingAnimationResolve) {\n            this.pendingAnimationResolve();\n            this.pendingAnimationResolve = null;\n        }\n        this.containerElement?.removeEventListener('toggle', this.handlePopoverToggleEvent);\n        this.containerElement = null;\n        this.contentElement = null;\n        this.controlElement = null;\n    }\n\n    componentWillLoad() {\n        if (!this.supportsPopoverAPI) {\n            console.warn(\n                'The Popover API is not supported in this browser. Please update your browser to the latest version. The component will use legacy mode.'\n            );\n            this.mode = 'legacy';\n        }\n    }\n\n    componentDidLoad() {\n        this.handleMinHeight();\n        if (this.supportsPopoverAPI) this.containerElement?.addEventListener('toggle', this.handlePopoverToggleEvent);\n        if (this.open) this.determinePopDirection();\n    }\n\n    // #endregion\n    // #region Listeners\n\n    @Listen('popoverState')\n    popoverStateHandler(event: CustomEvent<{ open: boolean }>) {\n        const {\n            detail: { open },\n        } = event;\n        if (open === this.open) return;\n\n        this.open = open;\n        event.stopPropagation();\n    }\n\n    // #endregion\n    // #region Public Methods API\n\n    @Method()\n    async scrollContainerTo(options: ScrollToOptions) {\n        this.containerElement?.scrollTo(options);\n    }\n\n    @Method()\n    async toggle() {\n        this.open = !this.open;\n    }\n\n    // #endregion\n    // #region Watchers\n\n    @Watch('minHeight')\n    minHeightProvided() {\n        this.handleMinHeight();\n    }\n\n    @Watch('open')\n    async openChanged(open: boolean) {\n        mirrorEmit(this, ['popoverStateChanged', 'tctPopoverStateChanged'], { open });\n\n        if (open) {\n            this.animationState = 'opening';\n            this.addViewportListeners();\n            this.determinePopDirection();\n        } else {\n            this.animationState = 'closing';\n            this.removeViewportListeners();\n\n            // Wait for close animation to complete\n            await new Promise<void>(resolve => {\n                if (!this.containerElement) {\n                    resolve();\n                    return;\n                }\n                const handleAnimationEnd = () => {\n                    this.pendingAnimationResolve = null;\n                    resolve();\n                };\n                this.pendingAnimationResolve = handleAnimationEnd;\n                this.containerElement.addEventListener('animationend', handleAnimationEnd, { once: true });\n            });\n\n            if (this.open) return;\n\n            if (!this.containerElement) return;\n            if (this.open) return;\n\n            this.currentDirection = undefined;\n            this.animationState = 'idle';\n            if (this.mode === 'legacy' || !this.supportsPopoverAPI) {\n                this.show = false;\n            } else {\n                this.containerElement?.hidePopover();\n            }\n\n            await waitForNextPaint();\n            this.clearCSSProperties();\n        }\n    }\n\n    // #endregion\n    // #region Local Methods\n\n    get isModule(): boolean {\n        const isIframe = window !== window.top;\n        const hasPlatformDimensions = Object.keys(window.Tecton?.platformDimensions ?? {}).length > 0;\n        return isIframe && hasPlatformDimensions;\n    }\n\n    get providedDirection(): 'up' | 'down' | undefined {\n        const { direction } = this;\n        switch (direction) {\n            case 'up':\n            case 'down':\n                return direction;\n            default:\n                return undefined;\n        }\n    }\n\n    get supportsPopoverAPI(): boolean {\n        return Object.hasOwn(HTMLElement.prototype, 'popover');\n    }\n\n    get validatedMaxHeight(): number | undefined {\n        const { maxHeight } = this;\n        return isNaN(maxHeight) ? undefined : maxHeight;\n    }\n\n    addViewportListeners() {\n        window.addEventListener('resize', this.viewPortOrientationChanged);\n        visualViewport?.addEventListener('resize', this.viewPortChanged);\n        if (isInScrollableContainer(this.hostElement) && !isMobile()) {\n            window.addEventListener('scroll', this.viewPortChanged, { passive: true, capture: true });\n        }\n        screen?.orientation?.addEventListener('orientationchange', this.viewPortOrientationChanged);\n        window.addEventListener('orientationchange', this.viewPortOrientationChanged);\n    }\n\n    clearCSSProperties() {\n        if (!this.containerElement) return;\n        this.containerElement.style.removeProperty('--comp-pop-max-height');\n        this.containerElement.style.removeProperty('--comp-pop-top');\n        this.containerElement.style.removeProperty('--comp-pop-bottom');\n        this.containerElement.style.removeProperty('--comp-pop-left');\n        this.containerElement.style.removeProperty('--comp-pop-right');\n        this.containerElement.style.removeProperty('--comp-pop-width');\n        this.containerElement.style.removeProperty('--comp-pop-opacity');\n    }\n\n    async determinePopDirection() {\n        const { containerElement, controlElement, providedDirection, displayBuffer } = this;\n        if (containerElement) containerElement.style.maxHeight = null;\n        await waitForNextPaint();\n        if (!this.containerElement) return;\n\n        const { isModule } = this;\n        const { top: controlTop, bottom: controlBottom } = controlElement?.getBoundingClientRect?.() ?? {\n            top: 0,\n            bottom: 0,\n        };\n\n        let windowHeight: number;\n        let maxSpaceAbove: number;\n        let maxSpaceBelow: number;\n        const isScrollableIframe = isModule && isInScrollableContainer(this.hostElement);\n        if (isModule && !isScrollableIframe) {\n            const {\n                outletOffset = 0,\n                innerHeight = window.innerHeight,\n                top: topBarHeight = 0,\n                bottom: bottomBarHeight = 0,\n            } = window.Tecton?.platformDimensions || {};\n\n            const distanceToIframeBottom = window.innerHeight - controlBottom;\n\n            // controlElement position visually on the page\n            const visualControlTop = outletOffset > 0 ? controlTop : controlTop + outletOffset - topBarHeight;\n            const visualControlBottom = outletOffset + controlBottom - topBarHeight;\n\n            // visual space around the controlElement\n            const viewableSpaceAbove = visualControlTop;\n            const viewableSpaceBelow = innerHeight - bottomBarHeight - visualControlBottom;\n\n            // calculate space above and below controlElement\n            const isIframeShorterThanWindow = distanceToIframeBottom < viewableSpaceBelow;\n            maxSpaceAbove = viewableSpaceAbove - displayBuffer;\n            maxSpaceBelow = isIframeShorterThanWindow\n                ? distanceToIframeBottom - displayBuffer\n                : viewableSpaceBelow - displayBuffer;\n        } else {\n            windowHeight = window.innerHeight;\n            maxSpaceAbove = controlTop - displayBuffer;\n            maxSpaceBelow = windowHeight - controlBottom - displayBuffer;\n        }\n\n        const directionWithMostSpace: 'up' | 'down' = maxSpaceAbove > maxSpaceBelow ? 'up' : 'down';\n\n        // We do not want to update the max height once the popover is open unless the page orientation shifts (resize or mobile use cases)\n        const shouldUpdateMaxHeight =\n            !containerElement?.style.getPropertyValue('--comp-pop-max-height') || this.orientationChanged;\n        // we do not want to constantly update the max-height after an orientation change, so we switch this back to false\n        this.orientationChanged = false;\n        const currentOrDetermineDirection = this.currentDirection || providedDirection || directionWithMostSpace;\n\n        switch (currentOrDetermineDirection) {\n            case 'up':\n                if (shouldUpdateMaxHeight && containerElement) {\n                    const priorityMaxHeight = this.validatedMaxHeight || maxSpaceAbove;\n                    const maxHeight = Math.min(maxSpaceAbove, priorityMaxHeight);\n                    containerElement.style.setProperty('--comp-pop-max-height', `${maxHeight}px`);\n                }\n                this.setDirectionAndShow('up');\n                break;\n            case 'down':\n                if (shouldUpdateMaxHeight && containerElement) {\n                    const priorityMaxHeight = this.validatedMaxHeight || maxSpaceBelow;\n                    const maxHeight = Math.min(maxSpaceBelow, priorityMaxHeight);\n                    containerElement.style.setProperty('--comp-pop-max-height', `${maxHeight}px`);\n                }\n                this.setDirectionAndShow('down');\n                break;\n            default:\n                break;\n        }\n    }\n\n    handleMinHeight = () => {\n        if (this.minHeight) {\n            handleDeprecationWarning(this, 'minHeight', 'prop');\n        }\n    };\n\n    handlePopoverToggleEvent = (event: ToggleEvent) => {\n        mirrorEmit(this, ['popoverStateChanged', 'tctPopoverStateChanged'], { open: event.newState === 'open' });\n    };\n\n    removeViewportListeners() {\n        window.removeEventListener('resize', this.viewPortOrientationChanged);\n        visualViewport?.removeEventListener('resize', this.viewPortChanged);\n        window.removeEventListener('scroll', this.viewPortChanged, { capture: true });\n        screen?.orientation?.removeEventListener('orientationchange', this.viewPortOrientationChanged);\n        window.removeEventListener('orientationchange', this.viewPortOrientationChanged);\n    }\n\n    setAbsoluteCSSProperties = async () => {\n        const { controlElement, containerElement, currentDirection, align } = this;\n        if (!containerElement) return;\n\n        if (align === 'right') {\n            containerElement.style.setProperty('--comp-pop-right', '0');\n            containerElement.style.setProperty('--comp-pop-left', 'unset');\n        } else {\n            containerElement.style.setProperty('--comp-pop-left', '0');\n            containerElement.style.setProperty('--comp-pop-right', 'unset');\n        }\n\n        if (this.block) {\n            containerElement.style.setProperty('--comp-pop-width', '100%');\n        }\n\n        if (currentDirection === 'up') {\n            const controlStyle = getComputedStyle(controlElement);\n            const controlSize =\n                parseInt(controlStyle.height || '0') +\n                parseInt(controlStyle.borderTopWidth || '0') +\n                parseInt(controlStyle.borderBottomWidth || '0');\n\n            containerElement.style.setProperty('--comp-pop-bottom', `${controlSize}px`);\n        }\n\n        // Wait for one paint to prevent layout thrashing\n        await waitForNextPaint();\n        if (this.containerElement) containerElement.style.setProperty('--comp-pop-opacity', '1');\n    };\n\n    setDirectionAndShow(direction: 'up' | 'down') {\n        // Due to some runtime inconsistency across devices/browsers we need to add one more check here because the\n        // popover can be closed between the time the popover is opened and the time the direction is determined\n        const isOpen = this.open;\n        if (!isOpen || !this.containerElement) return;\n\n        this.currentDirection = direction;\n        if (this.mode === 'legacy' || !this.supportsPopoverAPI) {\n            this.show = true;\n            this.setAbsoluteCSSProperties();\n        } else {\n            this.setPopoverAPICSSProperties();\n            this.containerElement?.showPopover();\n        }\n    }\n\n    setPopoverAPICSSProperties = async () => {\n        const { controlElement, containerElement, currentDirection, isModule, align } = this;\n        if (!containerElement) return;\n        const {\n            top: controlTop,\n            bottom: controlBottom,\n            left: controlLeft,\n            right: controlRight,\n        } = controlElement?.getBoundingClientRect?.() ?? {\n            top: 0,\n            bottom: 0,\n            left: 0,\n            right: 0,\n        };\n\n        const popoverLeft: number = controlLeft;\n        const popoverRight: number = window?.visualViewport?.width - controlRight;\n\n        if (align === 'right') {\n            containerElement.style.setProperty('--comp-pop-right', `${popoverRight - window.scrollX}px`);\n            containerElement.style.setProperty('--comp-pop-left', 'unset');\n        } else {\n            containerElement.style.setProperty('--comp-pop-left', `${popoverLeft + window.scrollX}px`);\n            containerElement.style.setProperty('--comp-pop-right', 'unset');\n        }\n\n        if (this.block) containerElement.style.setProperty('--comp-pop-width', `${controlElement?.offsetWidth || 0}px`);\n\n        const isScrollableIframe = isModule && isInScrollableContainer(this.hostElement);\n\n        if (currentDirection === 'up') {\n            if (isModule && !isScrollableIframe) {\n                containerElement.style.setProperty('--comp-pop-bottom', `${window.innerHeight - controlTop}px`);\n            } else {\n                containerElement.style.setProperty(\n                    '--comp-pop-bottom',\n                    `${window.innerHeight - controlTop - window.scrollY}px`\n                );\n            }\n        }\n\n        if (currentDirection === 'down') {\n            if (isModule && !isScrollableIframe) {\n                containerElement.style.setProperty('--comp-pop-top', `${controlBottom}px`);\n            } else {\n                containerElement.style.setProperty('--comp-pop-top', `${controlBottom + window.scrollY}px`);\n            }\n        }\n\n        // Wait for one paint to prevent layout thrashing\n        await waitForNextPaint();\n        if (this.containerElement) containerElement.style.setProperty('--comp-pop-opacity', '1');\n    };\n\n    viewPortChanged = () => {\n        if (!this.open) return;\n        this.determinePopDirection();\n    };\n\n    viewPortOrientationChanged = () => {\n        this.orientationChanged = true;\n        this.viewPortChanged();\n    };\n\n    // #endregion\n    // #region Render Methods\n\n    render() {\n        const containerClasses = ['container', this.currentDirection, this.align];\n        if (isMobile()) containerClasses.push('mobile');\n        if (this.show) containerClasses.push('show');\n        if (this.block) containerClasses.push('block');\n        if (this.mode === 'legacy') containerClasses.push('legacy');\n        if (this.animationState === 'opening') containerClasses.push('animating-open');\n        if (this.animationState === 'closing') containerClasses.push('animating-close');\n\n        return (\n            <div\n                ref={el => (this.containerElement = el)}\n                class={containerClasses.join(' ')}\n                test-id=\"outerContainer\"\n                tabIndex={-1}\n                popover=\"manual\"\n            >\n                <div\n                    ref={el => (this.contentElement = el)}\n                    class=\"content\"\n                >\n                    <slot />\n                </div>\n            </div>\n        );\n    }\n\n    // #endregion\n}\n"]}