q2-tecton-elements 1.55.6 → 1.55.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/bundle-report.json +196 -182
- package/dist/cjs/{index-905f4c87.js → index-b4cad57b.js} +68 -1
- package/dist/cjs/index-b4cad57b.js.map +1 -0
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/q2-action-group.cjs.entry.js +1 -1
- package/dist/cjs/q2-action-sheet.cjs.entry.js +1 -1
- package/dist/cjs/q2-badge_7.cjs.entry.js +1 -1
- package/dist/cjs/q2-calendar.cjs.entry.js +1 -1
- package/dist/cjs/q2-card.cjs.entry.js +1 -1
- package/dist/cjs/q2-carousel-pane.cjs.entry.js +1 -1
- package/dist/cjs/q2-carousel.cjs.entry.js +1 -1
- package/dist/cjs/q2-chart-area.cjs.entry.js +1 -1
- package/dist/cjs/q2-chart-bar.cjs.entry.js +1 -1
- package/dist/cjs/q2-chart-donut.cjs.entry.js +1 -1
- package/dist/cjs/q2-checkbox-group.cjs.entry.js +1 -1
- package/dist/cjs/q2-checkbox.cjs.entry.js +1 -1
- package/dist/cjs/q2-data-table.cjs.entry.js +1 -1
- package/dist/cjs/q2-detail.cjs.entry.js +1 -1
- package/dist/cjs/q2-dropdown-item.cjs.entry.js +1 -1
- package/dist/cjs/q2-dropdown.cjs.entry.js +4 -2
- package/dist/cjs/q2-dropdown.cjs.entry.js.map +1 -1
- package/dist/cjs/q2-editable-field.cjs.entry.js +1 -1
- package/dist/cjs/q2-file-picker.cjs.entry.js +1 -1
- package/dist/cjs/q2-item_3.cjs.entry.js +1 -1
- package/dist/cjs/q2-loc.cjs.entry.js +1 -1
- package/dist/cjs/q2-message.cjs.entry.js +1 -1
- package/dist/cjs/q2-modal.cjs.entry.js +1 -1
- package/dist/cjs/q2-month-picker.cjs.entry.js +1 -1
- package/dist/cjs/q2-optgroup.cjs.entry.js +1 -1
- package/dist/cjs/q2-option-list_2.cjs.entry.js +19 -14
- package/dist/cjs/q2-option-list_2.cjs.entry.js.map +1 -1
- package/dist/cjs/q2-option.cjs.entry.js +1 -1
- package/dist/cjs/q2-pagination.cjs.entry.js +1 -1
- package/dist/cjs/q2-pill.cjs.entry.js +1 -1
- package/dist/cjs/q2-radio-group.cjs.entry.js +1 -1
- package/dist/cjs/q2-radio.cjs.entry.js +1 -1
- package/dist/cjs/q2-relative-time.cjs.entry.js +1 -1
- package/dist/cjs/q2-section.cjs.entry.js +1 -1
- package/dist/cjs/q2-select.cjs.entry.js +51 -3
- package/dist/cjs/q2-select.cjs.entry.js.map +1 -1
- package/dist/cjs/q2-stepper-pane.cjs.entry.js +1 -1
- package/dist/cjs/q2-stepper-vertical.cjs.entry.js +1 -1
- package/dist/cjs/q2-stepper.cjs.entry.js +1 -1
- package/dist/cjs/q2-tag.cjs.entry.js +1 -1
- package/dist/cjs/q2-tecton-elements.cjs.js +1 -1
- package/dist/cjs/q2-textarea.cjs.entry.js +1 -1
- package/dist/cjs/q2-tooltip.cjs.entry.js +1 -1
- package/dist/collection/components/q2-dropdown/q2-dropdown.js +3 -1
- package/dist/collection/components/q2-dropdown/q2-dropdown.js.map +1 -1
- package/dist/collection/components/q2-popover/q2-popover.js +19 -14
- package/dist/collection/components/q2-popover/q2-popover.js.map +1 -1
- package/dist/collection/components/q2-popover/test/q2-popover-test.spec.js +230 -147
- package/dist/collection/components/q2-popover/test/q2-popover-test.spec.js.map +1 -1
- package/dist/collection/components/q2-select/q2-select.js +57 -3
- package/dist/collection/components/q2-select/q2-select.js.map +1 -1
- package/dist/collection/components/q2-select/test/q2-select-test.spec.js +146 -6
- package/dist/collection/components/q2-select/test/q2-select-test.spec.js.map +1 -1
- package/dist/collection/utils/index.js +71 -0
- package/dist/collection/utils/index.js.map +1 -1
- package/dist/components/index2.js +66 -1
- package/dist/components/index2.js.map +1 -1
- package/dist/components/q2-dropdown.js +3 -1
- package/dist/components/q2-dropdown.js.map +1 -1
- package/dist/components/q2-popover2.js +19 -14
- package/dist/components/q2-popover2.js.map +1 -1
- package/dist/components/q2-select2.js +52 -4
- package/dist/components/q2-select2.js.map +1 -1
- package/dist/esm/{index-f2a66217.js → index-d801f175.js} +67 -2
- package/dist/esm/index-d801f175.js.map +1 -0
- package/dist/esm/loader.js +1 -1
- package/dist/esm/q2-action-group.entry.js +1 -1
- package/dist/esm/q2-action-sheet.entry.js +1 -1
- package/dist/esm/q2-badge_7.entry.js +1 -1
- package/dist/esm/q2-calendar.entry.js +1 -1
- package/dist/esm/q2-card.entry.js +1 -1
- package/dist/esm/q2-carousel-pane.entry.js +1 -1
- package/dist/esm/q2-carousel.entry.js +1 -1
- package/dist/esm/q2-chart-area.entry.js +1 -1
- package/dist/esm/q2-chart-bar.entry.js +1 -1
- package/dist/esm/q2-chart-donut.entry.js +1 -1
- package/dist/esm/q2-checkbox-group.entry.js +1 -1
- package/dist/esm/q2-checkbox.entry.js +1 -1
- package/dist/esm/q2-data-table.entry.js +1 -1
- package/dist/esm/q2-detail.entry.js +1 -1
- package/dist/esm/q2-dropdown-item.entry.js +1 -1
- package/dist/esm/q2-dropdown.entry.js +4 -2
- package/dist/esm/q2-dropdown.entry.js.map +1 -1
- package/dist/esm/q2-editable-field.entry.js +1 -1
- package/dist/esm/q2-file-picker.entry.js +1 -1
- package/dist/esm/q2-item_3.entry.js +1 -1
- package/dist/esm/q2-loc.entry.js +1 -1
- package/dist/esm/q2-message.entry.js +1 -1
- package/dist/esm/q2-modal.entry.js +1 -1
- package/dist/esm/q2-month-picker.entry.js +1 -1
- package/dist/esm/q2-optgroup.entry.js +1 -1
- package/dist/esm/q2-option-list_2.entry.js +19 -14
- package/dist/esm/q2-option-list_2.entry.js.map +1 -1
- package/dist/esm/q2-option.entry.js +1 -1
- package/dist/esm/q2-pagination.entry.js +1 -1
- package/dist/esm/q2-pill.entry.js +1 -1
- package/dist/esm/q2-radio-group.entry.js +1 -1
- package/dist/esm/q2-radio.entry.js +1 -1
- package/dist/esm/q2-relative-time.entry.js +1 -1
- package/dist/esm/q2-section.entry.js +1 -1
- package/dist/esm/q2-select.entry.js +51 -3
- package/dist/esm/q2-select.entry.js.map +1 -1
- package/dist/esm/q2-stepper-pane.entry.js +1 -1
- package/dist/esm/q2-stepper-vertical.entry.js +1 -1
- package/dist/esm/q2-stepper.entry.js +1 -1
- package/dist/esm/q2-tag.entry.js +1 -1
- package/dist/esm/q2-tecton-elements.js +1 -1
- package/dist/esm/q2-textarea.entry.js +1 -1
- package/dist/esm/q2-tooltip.entry.js +1 -1
- package/dist/jest.setup.js +11 -0
- package/dist/jest.setup.js.map +1 -1
- package/dist/q2-tecton-elements/{index-f2a66217.js → index-d801f175.js} +116 -56
- package/dist/q2-tecton-elements/index-d801f175.js.map +1 -0
- package/dist/q2-tecton-elements/q2-action-group.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-action-sheet.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-badge_7.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-calendar.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-card.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-carousel-pane.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-carousel.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-chart-area.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-chart-bar.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-chart-donut.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-checkbox-group.entry.js +7 -7
- package/dist/q2-tecton-elements/q2-checkbox.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-data-table.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-detail.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-dropdown-item.entry.js +4 -4
- package/dist/q2-tecton-elements/q2-dropdown.entry.js +68 -66
- package/dist/q2-tecton-elements/q2-dropdown.entry.js.map +1 -1
- package/dist/q2-tecton-elements/q2-editable-field.entry.js +8 -8
- package/dist/q2-tecton-elements/q2-file-picker.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-item_3.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-loc.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-message.entry.js +16 -16
- package/dist/q2-tecton-elements/q2-modal.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-month-picker.entry.js +17 -17
- package/dist/q2-tecton-elements/q2-optgroup.entry.js +4 -4
- package/dist/q2-tecton-elements/q2-option-list_2.entry.js +53 -48
- package/dist/q2-tecton-elements/q2-option-list_2.entry.js.map +1 -1
- package/dist/q2-tecton-elements/q2-option.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-pagination.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-pill.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-radio-group.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-radio.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-relative-time.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-section.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-select.entry.js +64 -17
- package/dist/q2-tecton-elements/q2-select.entry.js.map +1 -1
- package/dist/q2-tecton-elements/q2-stepper-pane.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-stepper-vertical.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-stepper.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-tag.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-tecton-elements.esm.js +1 -1
- package/dist/q2-tecton-elements/q2-tecton-elements.esm.js.map +1 -1
- package/dist/q2-tecton-elements/q2-textarea.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-tooltip.entry.js +1 -1
- package/dist/types/builds/q2e/development/tecton/tecton/packages/q2-tecton-elements/.stencil/jest.setup.d.ts +9 -0
- package/dist/types/components/q2-select/q2-select.d.ts +10 -0
- package/dist/types/utils/index.d.ts +7 -0
- package/package.json +3 -3
- package/dist/cjs/index-905f4c87.js.map +0 -1
- package/dist/esm/index-f2a66217.js.map +0 -1
- package/dist/q2-tecton-elements/index-f2a66217.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"q2-popover.js","sourceRoot":"","sources":["../../../../src/components/q2-popover/q2-popover.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n Prop,\n h,\n ComponentInterface,\n Element,\n Watch,\n Method,\n Listen,\n EventEmitter,\n Event,\n State,\n} from '@stencil/core';\nimport { handleDeprecationWarning, waitForNextPaint } from '../../utils';\n\n@Component({ tag: 'q2-popover', shadow: true, styleUrl: 'q2-popover.scss' })\nexport class Q2Popover implements ComponentInterface {\n // #region Own Properties\n\n containerElement: HTMLDivElement;\n contentElement: HTMLDivElement;\n /**\n * The number of pixels to leave between the popover and the edge of the viewport\n */\n displayBuffer = 10;\n orientationChanged: boolean = false;\n\n // #endregion\n // #region Host HTML Element\n\n @Element()\n hostElement: HTMLElement;\n\n // #endregion\n // #region State Properties\n\n @State()\n currentDirection: 'down' | 'up' = undefined;\n\n // remove `show` when Popover API is supported in iOS\n @State()\n show: boolean = false;\n\n // #endregion\n // #region Public Property API\n\n /** Aligns the popover to the left or right side of the control element. */\n @Prop({ reflect: true })\n align: 'left' | 'right' = 'left';\n\n /** Indicates the popover will match the width of its parent element. */\n @Prop({ reflect: true })\n block: boolean;\n\n /** The element that controls the popover's behavior. */\n @Prop()\n controlElement: HTMLElement;\n\n /**\n * Force the direction of the popover when it opens.\n * If no value is passed, the component will auto-detect the direction based on available space.\n */\n @Prop({ reflect: true })\n direction: 'up' | 'down';\n\n /**\n * Force the maximum height of the popover. This value will be interpreted as pixels.\n * If no value is passed, or the value exceeds available space, the component will auto-detect the maximum height based on available space.\n */\n @Prop()\n maxHeight: number;\n\n /** @deprecated */\n @Prop()\n minHeight: number;\n\n @Prop()\n mode: 'legacy' = null;\n\n /** Controls whether the popover is open or closed. */\n @Prop({ reflect: true, mutable: true })\n open: boolean;\n\n // #endregion\n // #region Events\n\n /**\n * Emitted when the popover is opened or closed.\n */\n @Event()\n popoverStateChanged: EventEmitter<{ open: boolean }>;\n\n // #endregion\n // #region Component Lifecycle Events\n\n disconnectedCallback() {\n this.removeViewportListeners();\n this.containerElement.removeEventListener('toggle', this.handlePopoverToggleEvent);\n this.containerElement = null;\n this.contentElement = null;\n this.controlElement = null;\n }\n\n componentWillLoad() {\n if (!this.supportsPopoverAPI) {\n console.warn(\n 'The Popover API is not supported in this browser. Please update your browser to the latest version. The component will use legacy mode.'\n );\n this.mode = 'legacy';\n }\n }\n\n componentDidLoad() {\n this.handleMinHeight();\n if (this.supportsPopoverAPI) this.containerElement.addEventListener('toggle', this.handlePopoverToggleEvent);\n if (this.open) this.determinePopDirection();\n }\n\n // #endregion\n // #region Listeners\n\n @Listen('popoverState')\n popoverStateHandler(event: CustomEvent<{ open: boolean }>) {\n const {\n detail: { open },\n } = event;\n if (open === this.open) return;\n\n this.open = open;\n event.stopPropagation();\n }\n\n // #endregion\n // #region Public Methods API\n\n @Method()\n async scrollContainerTo(options: ScrollToOptions) {\n this.containerElement.scrollTo(options);\n }\n\n @Method()\n async toggle() {\n this.open = !this.open;\n }\n\n // #endregion\n // #region Watchers\n\n @Watch('minHeight')\n minHeightProvided() {\n this.handleMinHeight();\n }\n\n @Watch('open')\n async openChanged(open: boolean) {\n this.popoverStateChanged.emit({ open });\n\n if (open) {\n this.addViewportListeners();\n this.determinePopDirection();\n } else {\n this.removeViewportListeners();\n this.currentDirection = undefined;\n if (this.mode === 'legacy' || !this.supportsPopoverAPI) {\n this.show = false;\n } else {\n this.containerElement.hidePopover();\n }\n\n await waitForNextPaint();\n this.clearCSSProperties();\n }\n }\n\n // #endregion\n // #region Local Methods\n\n get isModule() {\n const isIframe = window !== window.top;\n const hasPlatformDimensions = Object.keys(window.Tecton?.platformDimensions ?? {}).length > 0;\n return isIframe && hasPlatformDimensions;\n }\n\n get providedDirection(): 'up' | 'down' | undefined {\n const { direction } = this;\n switch (direction) {\n case 'up':\n case 'down':\n return direction;\n default:\n return undefined;\n }\n }\n\n get supportsPopoverAPI(): boolean {\n return Object.hasOwn(HTMLElement.prototype, 'popover');\n }\n\n get validatedMaxHeight(): number | undefined {\n const { maxHeight } = this;\n return isNaN(maxHeight) ? undefined : maxHeight;\n }\n\n addViewportListeners() {\n window.addEventListener('resize', this.viewPortOrientationChanged);\n visualViewport?.addEventListener('resize', this.viewPortChanged);\n window.addEventListener('scroll', this.viewPortChanged, { passive: true, capture: true });\n screen?.orientation?.addEventListener('orientationchange', this.viewPortOrientationChanged);\n window.addEventListener('orientationchange', this.viewPortOrientationChanged);\n }\n\n clearCSSProperties() {\n this.containerElement.style.removeProperty('--comp-pop-max-height');\n this.containerElement.style.removeProperty('--comp-pop-top');\n this.containerElement.style.removeProperty('--comp-pop-bottom');\n this.containerElement.style.removeProperty('--comp-pop-left');\n this.containerElement.style.removeProperty('--comp-pop-right');\n this.containerElement.style.removeProperty('--comp-pop-width');\n this.containerElement.style.removeProperty('--comp-pop-opacity');\n }\n\n async determinePopDirection() {\n const { containerElement, controlElement, providedDirection, displayBuffer } = this;\n if (containerElement) containerElement.style.maxHeight = null;\n\n await waitForNextPaint();\n\n const { isModule } = this;\n const { top: controlTop, bottom: controlBottom } = controlElement?.getBoundingClientRect?.() ?? {\n top: 0,\n bottom: 0,\n };\n\n let windowHeight: number;\n let maxSpaceAbove: number;\n let maxSpaceBelow: number;\n\n if (isModule) {\n const { outletOffset = 0, innerHeight = window.innerHeight } = window.Tecton?.platformDimensions || {};\n const distanceToIframeBottom = window.visualViewport.height - controlBottom;\n const viewableSpaceBelow = innerHeight - (outletOffset + controlBottom);\n const isIframeShorterThanWindow = distanceToIframeBottom < viewableSpaceBelow;\n windowHeight = innerHeight;\n // If the top of the module is below the top of the window we just use the controlTop\n // Otherwise we need to add the outletOffset to the controlTop\n maxSpaceAbove = (outletOffset > 0 ? controlTop : controlTop + outletOffset) - displayBuffer;\n maxSpaceBelow = isIframeShorterThanWindow\n ? distanceToIframeBottom - displayBuffer\n : viewableSpaceBelow - displayBuffer;\n } else {\n windowHeight = window.visualViewport.height;\n maxSpaceAbove = controlTop - displayBuffer;\n maxSpaceBelow = windowHeight - controlBottom - displayBuffer;\n }\n\n const directionWithMostSpace: 'up' | 'down' = maxSpaceAbove > maxSpaceBelow ? 'up' : 'down';\n\n // We do not want to update the max height once the popover is open unless the page orientation shifts (resize or mobile use cases)\n const shouldUpdateMaxHeight =\n !containerElement.style.getPropertyValue('--comp-pop-max-height') || this.orientationChanged;\n // we do not want to constantly update the max-height after an orientation change, so we switch this back to false\n this.orientationChanged = false;\n const currentOrDetermineDirection = this.currentDirection || providedDirection || directionWithMostSpace;\n\n switch (currentOrDetermineDirection) {\n case 'up':\n if (shouldUpdateMaxHeight) {\n const priorityMaxHeight = this.validatedMaxHeight || maxSpaceAbove;\n const maxHeight = Math.min(maxSpaceAbove, priorityMaxHeight);\n containerElement.style.setProperty('--comp-pop-max-height', `${maxHeight}px`);\n }\n this.setDirectionAndShow('up');\n break;\n case 'down':\n if (shouldUpdateMaxHeight) {\n const priorityMaxHeight = this.validatedMaxHeight || maxSpaceBelow;\n const maxHeight = Math.min(maxSpaceBelow, priorityMaxHeight);\n containerElement.style.setProperty('--comp-pop-max-height', `${maxHeight}px`);\n }\n this.setDirectionAndShow('down');\n break;\n default:\n break;\n }\n }\n\n handleMinHeight = () => {\n if (this.minHeight) {\n handleDeprecationWarning(this, 'minHeight', 'prop');\n }\n };\n\n handlePopoverToggleEvent = (event: ToggleEvent) => {\n this.popoverStateChanged.emit({ open: event.newState === 'open' });\n };\n\n removeViewportListeners() {\n window.removeEventListener('resize', this.viewPortOrientationChanged);\n visualViewport?.removeEventListener('resize', this.viewPortChanged);\n window.removeEventListener('scroll', this.viewPortChanged, { capture: true });\n screen?.orientation?.removeEventListener('orientationchange', this.viewPortOrientationChanged);\n window.removeEventListener('orientationchange', this.viewPortOrientationChanged);\n }\n\n setAbsoluteCSSProperties = async () => {\n const { controlElement, containerElement, currentDirection, align } = this;\n\n if (align === 'right') {\n containerElement.style.setProperty('--comp-pop-right', '0');\n containerElement.style.setProperty('--comp-pop-left', 'unset');\n } else {\n containerElement.style.setProperty('--comp-pop-left', '0');\n containerElement.style.setProperty('--comp-pop-right', 'unset');\n }\n\n if (this.block) {\n containerElement.style.setProperty('--comp-pop-width', '100%');\n }\n\n if (currentDirection === 'up') {\n const controlStyle = getComputedStyle(controlElement);\n const controlSize =\n parseInt(controlStyle.height || '0') +\n parseInt(controlStyle.borderTopWidth || '0') +\n parseInt(controlStyle.borderBottomWidth || '0');\n\n containerElement.style.setProperty('--comp-pop-bottom', `${controlSize}px`);\n }\n\n // Wait for one paint to prevent layout thrashing\n await waitForNextPaint();\n containerElement.style.setProperty('--comp-pop-opacity', '1');\n };\n\n setDirectionAndShow(direction: 'up' | 'down') {\n // Due to some runtime inconsistency across devices/browsers we need to add one more check here because the\n // popover can be closed between the time the popover is opened and the time the direction is determined\n const isOpen = this.open;\n if (!isOpen) return;\n\n this.currentDirection = direction;\n if (this.mode === 'legacy' || !this.supportsPopoverAPI) {\n this.show = true;\n this.setAbsoluteCSSProperties();\n } else {\n this.setPopoverAPICSSProperties();\n this.containerElement.showPopover();\n }\n }\n\n setPopoverAPICSSProperties = async () => {\n const { controlElement, containerElement, currentDirection, isModule, align } = this;\n const {\n top: controlTop,\n bottom: controlBottom,\n left: controlLeft,\n right: controlRight,\n } = controlElement?.getBoundingClientRect?.() ?? {\n top: 0,\n bottom: 0,\n left: 0,\n right: 0,\n };\n\n const popoverLeft: number = controlLeft;\n const popoverRight: number = window?.visualViewport?.width - controlRight;\n\n if (align === 'right') {\n containerElement.style.setProperty('--comp-pop-right', `${popoverRight - window.scrollX}px`);\n containerElement.style.setProperty('--comp-pop-left', 'unset');\n } else {\n containerElement.style.setProperty('--comp-pop-left', `${popoverLeft + window.scrollX}px`);\n containerElement.style.setProperty('--comp-pop-right', 'unset');\n }\n\n if (this.block) containerElement.style.setProperty('--comp-pop-width', `${controlElement?.offsetWidth || 0}px`);\n\n if (currentDirection === 'up') {\n if (isModule) {\n containerElement.style.setProperty('--comp-pop-bottom', `${window.innerHeight - controlTop}px`);\n } else {\n containerElement.style.setProperty(\n '--comp-pop-bottom',\n `${window.innerHeight - controlTop - window?.visualViewport?.offsetTop - window.scrollY}px`\n );\n }\n }\n\n if (currentDirection === 'down') {\n if (isModule) {\n containerElement.style.setProperty('--comp-pop-top', `${controlBottom}px`);\n } else {\n containerElement.style.setProperty(\n '--comp-pop-top',\n `${controlBottom + (window?.visualViewport?.offsetTop ?? 0) + window.scrollY}px`\n );\n }\n }\n\n // Wait for one paint to prevent layout thrashing\n await waitForNextPaint();\n containerElement.style.setProperty('--comp-pop-opacity', '1');\n };\n\n viewPortChanged = () => {\n if (!this.open) return;\n this.determinePopDirection();\n };\n\n viewPortOrientationChanged = () => {\n this.orientationChanged = true;\n this.viewPortChanged();\n };\n\n // #endregion\n // #region Render Methods\n\n render() {\n const containerClasses = ['container', this.currentDirection, this.align];\n if (this.show) containerClasses.push('show');\n if (this.block) containerClasses.push('block');\n if (this.mode === 'legacy') containerClasses.push('legacy');\n\n return (\n <div\n ref={el => (this.containerElement = el)}\n class={containerClasses.join(' ')}\n test-id=\"outerContainer\"\n tabIndex={-1}\n popover=\"auto\"\n >\n <div\n ref={el => (this.contentElement = el)}\n class=\"content\"\n >\n <slot />\n </div>\n </div>\n );\n }\n\n // #endregion\n}\n"]}
|
|
1
|
+
{"version":3,"file":"q2-popover.js","sourceRoot":"","sources":["../../../../src/components/q2-popover/q2-popover.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n Prop,\n h,\n ComponentInterface,\n Element,\n Watch,\n Method,\n Listen,\n EventEmitter,\n Event,\n State,\n} from '@stencil/core';\nimport { handleDeprecationWarning, waitForNextPaint, isMobile, isInScrollableContainer } from '../../utils';\n\n@Component({ tag: 'q2-popover', shadow: true, styleUrl: 'q2-popover.scss' })\nexport class Q2Popover implements ComponentInterface {\n // #region Own Properties\n\n containerElement: HTMLDivElement;\n contentElement: HTMLDivElement;\n /**\n * The number of pixels to leave between the popover and the edge of the viewport\n */\n displayBuffer = 10;\n orientationChanged: boolean = false;\n\n // #endregion\n // #region Host HTML Element\n\n @Element()\n hostElement: HTMLElement;\n\n // #endregion\n // #region State Properties\n\n @State()\n currentDirection: 'down' | 'up' = undefined;\n\n // remove `show` when Popover API is supported in iOS\n @State()\n show: boolean = false;\n\n // #endregion\n // #region Public Property API\n\n /** Aligns the popover to the left or right side of the control element. */\n @Prop({ reflect: true })\n align: 'left' | 'right' = 'left';\n\n /** Indicates the popover will match the width of its parent element. */\n @Prop({ reflect: true })\n block: boolean;\n\n /** The element that controls the popover's behavior. */\n @Prop()\n controlElement: HTMLElement;\n\n /**\n * Force the direction of the popover when it opens.\n * If no value is passed, the component will auto-detect the direction based on available space.\n */\n @Prop({ reflect: true })\n direction: 'up' | 'down';\n\n /**\n * Force the maximum height of the popover. This value will be interpreted as pixels.\n * If no value is passed, or the value exceeds available space, the component will auto-detect the maximum height based on available space.\n */\n @Prop()\n maxHeight: number;\n\n /** @deprecated */\n @Prop()\n minHeight: number;\n\n @Prop()\n mode: 'legacy' = null;\n\n /** Controls whether the popover is open or closed. */\n @Prop({ reflect: true, mutable: true })\n open: boolean;\n\n // #endregion\n // #region Events\n\n /**\n * Emitted when the popover is opened or closed.\n */\n @Event()\n popoverStateChanged: EventEmitter<{ open: boolean }>;\n\n // #endregion\n // #region Component Lifecycle Events\n\n disconnectedCallback() {\n this.removeViewportListeners();\n this.containerElement.removeEventListener('toggle', this.handlePopoverToggleEvent);\n this.containerElement = null;\n this.contentElement = null;\n this.controlElement = null;\n }\n\n componentWillLoad() {\n if (!this.supportsPopoverAPI) {\n console.warn(\n 'The Popover API is not supported in this browser. Please update your browser to the latest version. The component will use legacy mode.'\n );\n this.mode = 'legacy';\n }\n }\n\n componentDidLoad() {\n this.handleMinHeight();\n if (this.supportsPopoverAPI) this.containerElement.addEventListener('toggle', this.handlePopoverToggleEvent);\n if (this.open) this.determinePopDirection();\n }\n\n // #endregion\n // #region Listeners\n\n @Listen('popoverState')\n popoverStateHandler(event: CustomEvent<{ open: boolean }>) {\n const {\n detail: { open },\n } = event;\n if (open === this.open) return;\n\n this.open = open;\n event.stopPropagation();\n }\n\n // #endregion\n // #region Public Methods API\n\n @Method()\n async scrollContainerTo(options: ScrollToOptions) {\n this.containerElement.scrollTo(options);\n }\n\n @Method()\n async toggle() {\n this.open = !this.open;\n }\n\n // #endregion\n // #region Watchers\n\n @Watch('minHeight')\n minHeightProvided() {\n this.handleMinHeight();\n }\n\n @Watch('open')\n async openChanged(open: boolean) {\n this.popoverStateChanged.emit({ open });\n\n if (open) {\n this.addViewportListeners();\n this.determinePopDirection();\n } else {\n this.removeViewportListeners();\n this.currentDirection = undefined;\n if (this.mode === 'legacy' || !this.supportsPopoverAPI) {\n this.show = false;\n } else {\n this.containerElement.hidePopover();\n }\n\n await waitForNextPaint();\n this.clearCSSProperties();\n }\n }\n\n // #endregion\n // #region Local Methods\n\n get isModule() {\n const isIframe = window !== window.top;\n const hasPlatformDimensions = Object.keys(window.Tecton?.platformDimensions ?? {}).length > 0;\n return isIframe && hasPlatformDimensions;\n }\n\n get providedDirection(): 'up' | 'down' | undefined {\n const { direction } = this;\n switch (direction) {\n case 'up':\n case 'down':\n return direction;\n default:\n return undefined;\n }\n }\n\n get supportsPopoverAPI(): boolean {\n return Object.hasOwn(HTMLElement.prototype, 'popover');\n }\n\n get validatedMaxHeight(): number | undefined {\n const { maxHeight } = this;\n return isNaN(maxHeight) ? undefined : maxHeight;\n }\n\n addViewportListeners() {\n window.addEventListener('resize', this.viewPortOrientationChanged);\n visualViewport?.addEventListener('resize', this.viewPortChanged);\n if (isInScrollableContainer(this.hostElement) && !isMobile()) {\n window.addEventListener('scroll', this.viewPortChanged, { passive: true, capture: true });\n }\n screen?.orientation?.addEventListener('orientationchange', this.viewPortOrientationChanged);\n window.addEventListener('orientationchange', this.viewPortOrientationChanged);\n }\n\n clearCSSProperties() {\n this.containerElement.style.removeProperty('--comp-pop-max-height');\n this.containerElement.style.removeProperty('--comp-pop-top');\n this.containerElement.style.removeProperty('--comp-pop-bottom');\n this.containerElement.style.removeProperty('--comp-pop-left');\n this.containerElement.style.removeProperty('--comp-pop-right');\n this.containerElement.style.removeProperty('--comp-pop-width');\n this.containerElement.style.removeProperty('--comp-pop-opacity');\n }\n\n async determinePopDirection() {\n const { containerElement, controlElement, providedDirection, displayBuffer } = this;\n if (containerElement) containerElement.style.maxHeight = null;\n await waitForNextPaint();\n\n const { isModule } = this;\n const { top: controlTop, bottom: controlBottom } = controlElement?.getBoundingClientRect?.() ?? {\n top: 0,\n bottom: 0,\n };\n\n let windowHeight: number;\n let maxSpaceAbove: number;\n let maxSpaceBelow: number;\n if (isModule) {\n const {\n outletOffset = 0,\n innerHeight = window.innerHeight,\n top: topBarHeight = 0,\n bottom: bottomBarHeight = 0,\n } = window.Tecton?.platformDimensions || {};\n\n const distanceToIframeBottom = window.innerHeight - controlBottom;\n\n // controlElement position visually on the page\n const visualControlTop = outletOffset > 0 ? controlTop : controlTop + outletOffset - topBarHeight;\n const visualControlBottom = outletOffset + controlBottom - topBarHeight;\n\n // visual space around the controlElement\n const viewableSpaceAbove = visualControlTop;\n const viewableSpaceBelow = innerHeight - bottomBarHeight - visualControlBottom;\n\n // calculate space above and below controlElement\n const isIframeShorterThanWindow = distanceToIframeBottom < viewableSpaceBelow;\n maxSpaceAbove = viewableSpaceAbove - displayBuffer;\n maxSpaceBelow = isIframeShorterThanWindow\n ? distanceToIframeBottom - displayBuffer\n : viewableSpaceBelow - displayBuffer;\n } else {\n windowHeight = window.innerHeight;\n maxSpaceAbove = controlTop - displayBuffer;\n maxSpaceBelow = windowHeight - controlBottom - displayBuffer;\n }\n\n const directionWithMostSpace: 'up' | 'down' = maxSpaceAbove > maxSpaceBelow ? 'up' : 'down';\n\n // We do not want to update the max height once the popover is open unless the page orientation shifts (resize or mobile use cases)\n const shouldUpdateMaxHeight =\n !containerElement.style.getPropertyValue('--comp-pop-max-height') || this.orientationChanged;\n // we do not want to constantly update the max-height after an orientation change, so we switch this back to false\n this.orientationChanged = false;\n const currentOrDetermineDirection = this.currentDirection || providedDirection || directionWithMostSpace;\n\n switch (currentOrDetermineDirection) {\n case 'up':\n if (shouldUpdateMaxHeight) {\n const priorityMaxHeight = this.validatedMaxHeight || maxSpaceAbove;\n const maxHeight = Math.min(maxSpaceAbove, priorityMaxHeight);\n containerElement.style.setProperty('--comp-pop-max-height', `${maxHeight}px`);\n }\n this.setDirectionAndShow('up');\n break;\n case 'down':\n if (shouldUpdateMaxHeight) {\n const priorityMaxHeight = this.validatedMaxHeight || maxSpaceBelow;\n const maxHeight = Math.min(maxSpaceBelow, priorityMaxHeight);\n containerElement.style.setProperty('--comp-pop-max-height', `${maxHeight}px`);\n }\n this.setDirectionAndShow('down');\n break;\n default:\n break;\n }\n }\n\n handleMinHeight = () => {\n if (this.minHeight) {\n handleDeprecationWarning(this, 'minHeight', 'prop');\n }\n };\n\n handlePopoverToggleEvent = (event: ToggleEvent) => {\n this.popoverStateChanged.emit({ open: event.newState === 'open' });\n };\n\n removeViewportListeners() {\n window.removeEventListener('resize', this.viewPortOrientationChanged);\n visualViewport?.removeEventListener('resize', this.viewPortChanged);\n window.removeEventListener('scroll', this.viewPortChanged, { capture: true });\n screen?.orientation?.removeEventListener('orientationchange', this.viewPortOrientationChanged);\n window.removeEventListener('orientationchange', this.viewPortOrientationChanged);\n }\n\n setAbsoluteCSSProperties = async () => {\n const { controlElement, containerElement, currentDirection, align } = this;\n\n if (align === 'right') {\n containerElement.style.setProperty('--comp-pop-right', '0');\n containerElement.style.setProperty('--comp-pop-left', 'unset');\n } else {\n containerElement.style.setProperty('--comp-pop-left', '0');\n containerElement.style.setProperty('--comp-pop-right', 'unset');\n }\n\n if (this.block) {\n containerElement.style.setProperty('--comp-pop-width', '100%');\n }\n\n if (currentDirection === 'up') {\n const controlStyle = getComputedStyle(controlElement);\n const controlSize =\n parseInt(controlStyle.height || '0') +\n parseInt(controlStyle.borderTopWidth || '0') +\n parseInt(controlStyle.borderBottomWidth || '0');\n\n containerElement.style.setProperty('--comp-pop-bottom', `${controlSize}px`);\n }\n\n // Wait for one paint to prevent layout thrashing\n await waitForNextPaint();\n containerElement.style.setProperty('--comp-pop-opacity', '1');\n };\n\n setDirectionAndShow(direction: 'up' | 'down') {\n // Due to some runtime inconsistency across devices/browsers we need to add one more check here because the\n // popover can be closed between the time the popover is opened and the time the direction is determined\n const isOpen = this.open;\n if (!isOpen) return;\n\n this.currentDirection = direction;\n if (this.mode === 'legacy' || !this.supportsPopoverAPI) {\n this.show = true;\n this.setAbsoluteCSSProperties();\n } else {\n this.setPopoverAPICSSProperties();\n this.containerElement.showPopover();\n }\n }\n\n setPopoverAPICSSProperties = async () => {\n const { controlElement, containerElement, currentDirection, isModule, align } = this;\n const {\n top: controlTop,\n bottom: controlBottom,\n left: controlLeft,\n right: controlRight,\n } = controlElement?.getBoundingClientRect?.() ?? {\n top: 0,\n bottom: 0,\n left: 0,\n right: 0,\n };\n\n const popoverLeft: number = controlLeft;\n const popoverRight: number = window?.visualViewport?.width - controlRight;\n\n if (align === 'right') {\n containerElement.style.setProperty('--comp-pop-right', `${popoverRight - window.scrollX}px`);\n containerElement.style.setProperty('--comp-pop-left', 'unset');\n } else {\n containerElement.style.setProperty('--comp-pop-left', `${popoverLeft + window.scrollX}px`);\n containerElement.style.setProperty('--comp-pop-right', 'unset');\n }\n\n if (this.block) containerElement.style.setProperty('--comp-pop-width', `${controlElement?.offsetWidth || 0}px`);\n\n if (currentDirection === 'up') {\n if (isModule) {\n containerElement.style.setProperty('--comp-pop-bottom', `${window.innerHeight - controlTop}px`);\n } else {\n containerElement.style.setProperty(\n '--comp-pop-bottom',\n `${window.innerHeight - controlTop - window.scrollY}px`\n );\n }\n }\n\n if (currentDirection === 'down') {\n if (isModule) {\n containerElement.style.setProperty('--comp-pop-top', `${controlBottom}px`);\n } else {\n containerElement.style.setProperty('--comp-pop-top', `${controlBottom + window.scrollY}px`);\n }\n }\n\n // Wait for one paint to prevent layout thrashing\n await waitForNextPaint();\n containerElement.style.setProperty('--comp-pop-opacity', '1');\n };\n\n viewPortChanged = () => {\n if (!this.open) return;\n this.determinePopDirection();\n };\n\n viewPortOrientationChanged = () => {\n this.orientationChanged = true;\n this.viewPortChanged();\n };\n\n // #endregion\n // #region Render Methods\n\n render() {\n const containerClasses = ['container', this.currentDirection, this.align];\n if (this.show) containerClasses.push('show');\n if (this.block) containerClasses.push('block');\n if (this.mode === 'legacy') containerClasses.push('legacy');\n\n return (\n <div\n ref={el => (this.containerElement = el)}\n class={containerClasses.join(' ')}\n test-id=\"outerContainer\"\n tabIndex={-1}\n popover=\"manual\"\n >\n <div\n ref={el => (this.contentElement = el)}\n class=\"content\"\n >\n <slot />\n </div>\n </div>\n );\n }\n\n // #endregion\n}\n"]}
|
|
@@ -1,13 +1,18 @@
|
|
|
1
1
|
import { newSpecPage } from "@stencil/core/testing";
|
|
2
2
|
import { Q2Popover } from "../q2-popover";
|
|
3
|
-
import
|
|
3
|
+
import * as utils from "../../../utils/index";
|
|
4
4
|
describe('popover', () => {
|
|
5
5
|
let specPopover;
|
|
6
|
+
afterEach(() => {
|
|
7
|
+
jest.restoreAllMocks();
|
|
8
|
+
});
|
|
6
9
|
const samplePlatformDimensions = {
|
|
7
10
|
scrollY: 0,
|
|
8
11
|
innerHeight: 800,
|
|
9
12
|
innerWidth: 600,
|
|
10
13
|
outletOffset: 20,
|
|
14
|
+
top: 0,
|
|
15
|
+
bottom: 0,
|
|
11
16
|
};
|
|
12
17
|
const sampleTectonWindow = {
|
|
13
18
|
inMobileApp: false,
|
|
@@ -423,7 +428,6 @@ describe('popover', () => {
|
|
|
423
428
|
let visualViewportAddEventListenerSpy;
|
|
424
429
|
let screenOrientationAddEventListenerSpy;
|
|
425
430
|
beforeEach(() => {
|
|
426
|
-
specPopover = new Q2Popover();
|
|
427
431
|
windowAddEventListenerSpy = jest.spyOn(window, 'addEventListener');
|
|
428
432
|
// Mock visualViewport
|
|
429
433
|
const mockVisualViewport = {
|
|
@@ -450,6 +454,7 @@ describe('popover', () => {
|
|
|
450
454
|
});
|
|
451
455
|
global.screen = mockScreen;
|
|
452
456
|
screenOrientationAddEventListenerSpy = jest.spyOn(mockScreenOrientation, 'addEventListener');
|
|
457
|
+
specPopover = new Q2Popover();
|
|
453
458
|
});
|
|
454
459
|
afterEach(() => {
|
|
455
460
|
windowAddEventListenerSpy.mockRestore();
|
|
@@ -460,30 +465,56 @@ describe('popover', () => {
|
|
|
460
465
|
delete window.visualViewport;
|
|
461
466
|
delete window.screen;
|
|
462
467
|
});
|
|
463
|
-
|
|
464
|
-
|
|
465
|
-
|
|
466
|
-
|
|
467
|
-
|
|
468
|
-
|
|
469
|
-
|
|
470
|
-
|
|
471
|
-
it('adds scroll listener to window with viewPortChanged handler and proper options', () => {
|
|
472
|
-
specPopover.addViewportListeners();
|
|
473
|
-
expect(windowAddEventListenerSpy).toHaveBeenCalledWith('scroll', specPopover.viewPortChanged, {
|
|
474
|
-
passive: true,
|
|
475
|
-
capture: true,
|
|
468
|
+
describe('resize', () => {
|
|
469
|
+
it('adds resize listener to window with viewPortOrientationChanged handler', async () => {
|
|
470
|
+
specPopover.addViewportListeners();
|
|
471
|
+
expect(windowAddEventListenerSpy).toHaveBeenCalledWith('resize', specPopover.viewPortOrientationChanged);
|
|
472
|
+
});
|
|
473
|
+
it('adds resize listener to visualViewport with viewPortChanged handler', async () => {
|
|
474
|
+
specPopover.addViewportListeners();
|
|
475
|
+
expect(visualViewportAddEventListenerSpy).toHaveBeenCalledWith('resize', specPopover.viewPortChanged);
|
|
476
476
|
});
|
|
477
477
|
});
|
|
478
|
-
|
|
479
|
-
|
|
480
|
-
|
|
478
|
+
describe('scroll', () => {
|
|
479
|
+
it('adds scroll listener to window when in scrollable container on desktop only', async () => {
|
|
480
|
+
jest.spyOn(utils, 'isInScrollableContainer').mockReturnValue(true);
|
|
481
|
+
jest.spyOn(utils, 'isMobile').mockReturnValue(false);
|
|
482
|
+
specPopover.addViewportListeners();
|
|
483
|
+
expect(windowAddEventListenerSpy).toHaveBeenCalledWith('scroll', specPopover.viewPortChanged, {
|
|
484
|
+
passive: true,
|
|
485
|
+
capture: true,
|
|
486
|
+
});
|
|
487
|
+
});
|
|
488
|
+
it('does not add scroll listener on mobile', async () => {
|
|
489
|
+
jest.spyOn(utils, 'isInScrollableContainer').mockReturnValue(true);
|
|
490
|
+
jest.spyOn(utils, 'isMobile').mockReturnValue(true);
|
|
491
|
+
specPopover.addViewportListeners();
|
|
492
|
+
expect(windowAddEventListenerSpy).not.toHaveBeenCalledWith('scroll', specPopover.viewPortChanged, {
|
|
493
|
+
passive: true,
|
|
494
|
+
capture: true,
|
|
495
|
+
});
|
|
496
|
+
});
|
|
497
|
+
it('does not add scroll listener in non-scrollable container', async () => {
|
|
498
|
+
jest.spyOn(utils, 'isInScrollableContainer').mockReturnValue(false);
|
|
499
|
+
jest.spyOn(utils, 'isMobile').mockReturnValue(false);
|
|
500
|
+
specPopover.addViewportListeners();
|
|
501
|
+
expect(windowAddEventListenerSpy).not.toHaveBeenCalledWith('scroll', specPopover.viewPortChanged, {
|
|
502
|
+
passive: true,
|
|
503
|
+
capture: true,
|
|
504
|
+
});
|
|
505
|
+
});
|
|
481
506
|
});
|
|
482
|
-
|
|
483
|
-
|
|
484
|
-
|
|
507
|
+
describe('orientationchange', () => {
|
|
508
|
+
it('adds orientationchange listener to screen.orientation with viewPortOrientationChanged handler', async () => {
|
|
509
|
+
specPopover.addViewportListeners();
|
|
510
|
+
expect(screenOrientationAddEventListenerSpy).toHaveBeenCalledWith('orientationchange', specPopover.viewPortOrientationChanged);
|
|
511
|
+
});
|
|
512
|
+
it('adds orientationchange listener to window with viewPortOrientationChanged handler', async () => {
|
|
513
|
+
specPopover.addViewportListeners();
|
|
514
|
+
expect(windowAddEventListenerSpy).toHaveBeenCalledWith('orientationchange', specPopover.viewPortOrientationChanged);
|
|
515
|
+
});
|
|
485
516
|
});
|
|
486
|
-
it('adds all expected listeners when called', () => {
|
|
517
|
+
it('adds all expected listeners when called', async () => {
|
|
487
518
|
specPopover.addViewportListeners();
|
|
488
519
|
expect(windowAddEventListenerSpy).toHaveBeenCalled();
|
|
489
520
|
expect(visualViewportAddEventListenerSpy).toHaveBeenCalled();
|
|
@@ -520,44 +551,192 @@ describe('popover', () => {
|
|
|
520
551
|
let specPopover;
|
|
521
552
|
let controlElement;
|
|
522
553
|
let containerElement;
|
|
523
|
-
beforeEach(() => {
|
|
554
|
+
beforeEach(async () => {
|
|
524
555
|
specPopover = new Q2Popover();
|
|
556
|
+
specPopover.setDirectionAndShow = jest.fn();
|
|
525
557
|
controlElement = document.createElement('div');
|
|
526
|
-
containerElement = document.createElement('div');
|
|
527
558
|
specPopover.controlElement = controlElement;
|
|
559
|
+
containerElement = document.createElement('div');
|
|
528
560
|
specPopover.containerElement = containerElement;
|
|
529
|
-
window.visualViewport = { width: 800, height: 600 };
|
|
530
|
-
specPopover.setDirectionAndShow = jest.fn();
|
|
531
561
|
});
|
|
532
|
-
|
|
533
|
-
|
|
534
|
-
|
|
535
|
-
|
|
562
|
+
afterEach(() => {
|
|
563
|
+
delete window.visualViewport;
|
|
564
|
+
delete window.Tecton;
|
|
565
|
+
delete window.innerHeight;
|
|
566
|
+
});
|
|
567
|
+
describe('when in a module', () => {
|
|
568
|
+
beforeEach(async () => {
|
|
569
|
+
window.Tecton = sampleTectonWindow;
|
|
570
|
+
jest.spyOn(window, 'top', 'get').mockReturnValue({});
|
|
571
|
+
specPopover.open = true;
|
|
572
|
+
expect(specPopover.isModule).toBe(true);
|
|
573
|
+
});
|
|
574
|
+
describe("when the module is taller than the window's viewport", () => {
|
|
575
|
+
beforeEach(() => {
|
|
576
|
+
window.innerHeight = 1200;
|
|
577
|
+
});
|
|
578
|
+
it('sets the direction to down when control element has more space below it', async () => {
|
|
579
|
+
jest.spyOn(controlElement, 'getBoundingClientRect').mockReturnValue({
|
|
580
|
+
top: 20,
|
|
581
|
+
bottom: 70,
|
|
582
|
+
});
|
|
583
|
+
await specPopover.determinePopDirection();
|
|
584
|
+
expect(containerElement.style.getPropertyValue('--comp-pop-max-height')).toBe('700px');
|
|
585
|
+
expect(specPopover.setDirectionAndShow).toHaveBeenCalledWith('down');
|
|
586
|
+
});
|
|
587
|
+
it('sets the direction to up when control element has more space above it', async () => {
|
|
588
|
+
jest.spyOn(controlElement, 'getBoundingClientRect').mockReturnValue({
|
|
589
|
+
top: 600,
|
|
590
|
+
bottom: 650,
|
|
591
|
+
});
|
|
592
|
+
await specPopover.determinePopDirection();
|
|
593
|
+
expect(containerElement.style.getPropertyValue('--comp-pop-max-height')).toBe('590px');
|
|
594
|
+
expect(specPopover.setDirectionAndShow).toHaveBeenCalledWith('up');
|
|
595
|
+
});
|
|
596
|
+
describe('when the outletOffset is 0 or less', () => {
|
|
597
|
+
beforeEach(() => {
|
|
598
|
+
window.Tecton = Object.assign(Object.assign({}, sampleTectonWindow), { platformDimensions: Object.assign(Object.assign({}, samplePlatformDimensions), { outletOffset: -50 }) });
|
|
599
|
+
});
|
|
600
|
+
it('sets the direction to down when control element has more space below it', async () => {
|
|
601
|
+
jest.spyOn(controlElement, 'getBoundingClientRect').mockReturnValue({
|
|
602
|
+
top: 20,
|
|
603
|
+
bottom: 70,
|
|
604
|
+
});
|
|
605
|
+
await specPopover.determinePopDirection();
|
|
606
|
+
expect(containerElement.style.getPropertyValue('--comp-pop-max-height')).toBe('770px');
|
|
607
|
+
expect(specPopover.setDirectionAndShow).toHaveBeenCalledWith('down');
|
|
608
|
+
});
|
|
609
|
+
it('sets the direction to up when control element has more space above it', async () => {
|
|
610
|
+
jest.spyOn(controlElement, 'getBoundingClientRect').mockReturnValue({
|
|
611
|
+
top: 600,
|
|
612
|
+
bottom: 650,
|
|
613
|
+
});
|
|
614
|
+
await specPopover.determinePopDirection();
|
|
615
|
+
expect(containerElement.style.getPropertyValue('--comp-pop-max-height')).toBe('540px');
|
|
616
|
+
expect(specPopover.setDirectionAndShow).toHaveBeenCalledWith('up');
|
|
617
|
+
});
|
|
618
|
+
});
|
|
619
|
+
describe('when the "top" platformDimension has a value', () => {
|
|
620
|
+
beforeEach(() => {
|
|
621
|
+
window.Tecton = Object.assign(Object.assign({}, sampleTectonWindow), { platformDimensions: Object.assign(Object.assign({}, samplePlatformDimensions), { outletOffset: 0, top: 50 }) });
|
|
622
|
+
});
|
|
623
|
+
it('takes the "top" into account when opening up', async () => {
|
|
624
|
+
jest.spyOn(controlElement, 'getBoundingClientRect').mockReturnValue({
|
|
625
|
+
top: 600,
|
|
626
|
+
bottom: 650,
|
|
627
|
+
});
|
|
628
|
+
await specPopover.determinePopDirection();
|
|
629
|
+
expect(containerElement.style.getPropertyValue('--comp-pop-max-height')).toBe('540px');
|
|
630
|
+
expect(specPopover.setDirectionAndShow).toHaveBeenCalledWith('up');
|
|
631
|
+
});
|
|
632
|
+
it('ignores "top" when outletOffset is positive', async () => {
|
|
633
|
+
window.Tecton = Object.assign(Object.assign({}, sampleTectonWindow), { platformDimensions: Object.assign(Object.assign({}, samplePlatformDimensions), { outletOffset: 20 }) });
|
|
634
|
+
jest.spyOn(controlElement, 'getBoundingClientRect').mockReturnValue({
|
|
635
|
+
top: 600,
|
|
636
|
+
bottom: 650,
|
|
637
|
+
});
|
|
638
|
+
await specPopover.determinePopDirection();
|
|
639
|
+
expect(containerElement.style.getPropertyValue('--comp-pop-max-height')).toBe('590px');
|
|
640
|
+
expect(specPopover.setDirectionAndShow).toHaveBeenCalledWith('up');
|
|
641
|
+
});
|
|
642
|
+
});
|
|
643
|
+
describe('when the "bottom" platformDimension has a value', () => {
|
|
644
|
+
it('takes "bottom" into account when calculating space below', async () => {
|
|
645
|
+
window.Tecton = Object.assign(Object.assign({}, sampleTectonWindow), { platformDimensions: Object.assign(Object.assign({}, samplePlatformDimensions), { bottom: 50 }) });
|
|
646
|
+
jest.spyOn(controlElement, 'getBoundingClientRect').mockReturnValue({
|
|
647
|
+
top: 20,
|
|
648
|
+
bottom: 70,
|
|
649
|
+
});
|
|
650
|
+
await specPopover.determinePopDirection();
|
|
651
|
+
expect(containerElement.style.getPropertyValue('--comp-pop-max-height')).toBe('650px');
|
|
652
|
+
expect(specPopover.setDirectionAndShow).toHaveBeenCalledWith('down');
|
|
653
|
+
});
|
|
654
|
+
});
|
|
655
|
+
});
|
|
656
|
+
describe("when the module is shorter than the window's viewport", () => {
|
|
657
|
+
beforeEach(() => {
|
|
658
|
+
window.innerHeight = 600;
|
|
659
|
+
});
|
|
660
|
+
it('sets the direction to down when control element has more space below it', async () => {
|
|
661
|
+
jest.spyOn(controlElement, 'getBoundingClientRect').mockReturnValue({
|
|
662
|
+
top: 20,
|
|
663
|
+
bottom: 70,
|
|
664
|
+
});
|
|
665
|
+
await specPopover.determinePopDirection();
|
|
666
|
+
expect(containerElement.style.getPropertyValue('--comp-pop-max-height')).toBe('520px');
|
|
667
|
+
expect(specPopover.setDirectionAndShow).toHaveBeenCalledWith('down');
|
|
668
|
+
});
|
|
669
|
+
it('sets the direction to up when control element has more space above it', async () => {
|
|
670
|
+
jest.spyOn(controlElement, 'getBoundingClientRect').mockReturnValue({
|
|
671
|
+
top: 500,
|
|
672
|
+
bottom: 550,
|
|
673
|
+
});
|
|
674
|
+
await specPopover.determinePopDirection();
|
|
675
|
+
expect(containerElement.style.getPropertyValue('--comp-pop-max-height')).toBe('490px');
|
|
676
|
+
expect(specPopover.setDirectionAndShow).toHaveBeenCalledWith('up');
|
|
677
|
+
});
|
|
678
|
+
});
|
|
679
|
+
});
|
|
680
|
+
describe('when at the platform level', () => {
|
|
681
|
+
beforeEach(async () => {
|
|
682
|
+
window.innerHeight = 600;
|
|
683
|
+
expect(specPopover.isModule).toBe(false);
|
|
684
|
+
});
|
|
685
|
+
it('sets the direction to up when control element has more space above it', async () => {
|
|
686
|
+
const controlSpy = jest.spyOn(controlElement, 'getBoundingClientRect').mockReturnValue({
|
|
687
|
+
top: 500,
|
|
688
|
+
bottom: 550,
|
|
689
|
+
});
|
|
690
|
+
await specPopover.determinePopDirection();
|
|
691
|
+
expect(containerElement.style.getPropertyValue('--comp-pop-max-height')).toBe('490px');
|
|
692
|
+
expect(specPopover.setDirectionAndShow).toHaveBeenCalledWith('up');
|
|
693
|
+
controlSpy.mockRestore();
|
|
536
694
|
});
|
|
537
|
-
|
|
538
|
-
|
|
539
|
-
|
|
540
|
-
|
|
541
|
-
|
|
542
|
-
|
|
543
|
-
|
|
544
|
-
|
|
545
|
-
|
|
695
|
+
it('sets the direction to down when control element has more space below it', async () => {
|
|
696
|
+
const controlSpy = jest.spyOn(controlElement, 'getBoundingClientRect').mockReturnValue({
|
|
697
|
+
top: 100,
|
|
698
|
+
bottom: 150,
|
|
699
|
+
});
|
|
700
|
+
await specPopover.determinePopDirection();
|
|
701
|
+
expect(containerElement.style.getPropertyValue('--comp-pop-max-height')).toBe('440px');
|
|
702
|
+
expect(specPopover.setDirectionAndShow).toHaveBeenCalledWith('down');
|
|
703
|
+
controlSpy.mockRestore();
|
|
546
704
|
});
|
|
547
|
-
await specPopover.determinePopDirection();
|
|
548
|
-
expect(containerElement.style.getPropertyValue('--comp-pop-max-height')).toBe('440px');
|
|
549
|
-
expect(specPopover.setDirectionAndShow).toHaveBeenCalledWith('down');
|
|
550
|
-
controlSpy.mockRestore();
|
|
551
705
|
});
|
|
552
706
|
});
|
|
553
707
|
describe('handleMinHeight', () => {
|
|
554
708
|
it('calls handleDeprecationWarning for minHeight', async () => {
|
|
555
709
|
specPopover = new Q2Popover();
|
|
556
|
-
const
|
|
557
|
-
|
|
710
|
+
const mockHandleDeprecation = jest
|
|
711
|
+
.spyOn(utils, 'handleDeprecationWarning')
|
|
712
|
+
.mockImplementation(() => { });
|
|
558
713
|
specPopover.minHeight = 100;
|
|
559
714
|
specPopover.handleMinHeight();
|
|
560
|
-
expect(
|
|
715
|
+
expect(mockHandleDeprecation).toHaveBeenCalled();
|
|
716
|
+
});
|
|
717
|
+
});
|
|
718
|
+
describe('handlePopoverToggleEvent', () => {
|
|
719
|
+
it('emits the popoverStateChanged event', async () => {
|
|
720
|
+
specPopover = new Q2Popover();
|
|
721
|
+
const mockEmit = jest.spyOn(specPopover.popoverStateChanged, 'emit');
|
|
722
|
+
specPopover.handlePopoverToggleEvent({});
|
|
723
|
+
expect(mockEmit).toHaveBeenCalled();
|
|
724
|
+
});
|
|
725
|
+
describe('when the newState from the ToggleEvent is "open"', () => {
|
|
726
|
+
it('emits the popoverStateChanged event open as true', async () => {
|
|
727
|
+
specPopover = new Q2Popover();
|
|
728
|
+
const mockEmit = jest.spyOn(specPopover.popoverStateChanged, 'emit');
|
|
729
|
+
specPopover.handlePopoverToggleEvent({ newState: 'open' });
|
|
730
|
+
expect(mockEmit).toHaveBeenCalledWith({ open: true });
|
|
731
|
+
});
|
|
732
|
+
});
|
|
733
|
+
describe('when the newState from the ToggleEvent is "closed"', () => {
|
|
734
|
+
it('emits the popoverStateChanged event open as false', async () => {
|
|
735
|
+
specPopover = new Q2Popover();
|
|
736
|
+
const mockEmit = jest.spyOn(specPopover.popoverStateChanged, 'emit');
|
|
737
|
+
specPopover.handlePopoverToggleEvent({ newState: 'closed' });
|
|
738
|
+
expect(mockEmit).toHaveBeenCalledWith({ open: false });
|
|
739
|
+
});
|
|
561
740
|
});
|
|
562
741
|
});
|
|
563
742
|
describe('removeViewportListeners', () => {
|
|
@@ -599,23 +778,23 @@ describe('popover', () => {
|
|
|
599
778
|
delete window.visualViewport;
|
|
600
779
|
delete window.screen;
|
|
601
780
|
});
|
|
602
|
-
it('removes resize listener from window with viewPortOrientationChanged handler', () => {
|
|
781
|
+
it('removes resize listener from window with viewPortOrientationChanged handler', async () => {
|
|
603
782
|
specPopover.removeViewportListeners();
|
|
604
783
|
expect(windowRemoveEventListenerSpy).toHaveBeenCalledWith('resize', specPopover.viewPortOrientationChanged);
|
|
605
784
|
});
|
|
606
|
-
it('removes resize listener from visualViewport with viewPortChanged handler', () => {
|
|
785
|
+
it('removes resize listener from visualViewport with viewPortChanged handler', async () => {
|
|
607
786
|
specPopover.removeViewportListeners();
|
|
608
787
|
expect(visualViewportRemoveEventListenerSpy).toHaveBeenCalledWith('resize', specPopover.viewPortChanged);
|
|
609
788
|
});
|
|
610
|
-
it('removes scroll listener from window with viewPortChanged handler and proper options', () => {
|
|
789
|
+
it('removes scroll listener from window with viewPortChanged handler and proper options', async () => {
|
|
611
790
|
specPopover.removeViewportListeners();
|
|
612
791
|
expect(windowRemoveEventListenerSpy).toHaveBeenNthCalledWith(2, 'scroll', specPopover.viewPortChanged, { capture: true });
|
|
613
792
|
});
|
|
614
|
-
it('removes orientationchange listener from screen.orientation with viewPortOrientationChanged handler', () => {
|
|
793
|
+
it('removes orientationchange listener from screen.orientation with viewPortOrientationChanged handler', async () => {
|
|
615
794
|
specPopover.removeViewportListeners();
|
|
616
795
|
expect(screenOrientationRemoveEventListenerSpy).toHaveBeenCalledWith('orientationchange', specPopover.viewPortOrientationChanged);
|
|
617
796
|
});
|
|
618
|
-
it('removes orientationchange listener from window with viewPortOrientationChanged handler', () => {
|
|
797
|
+
it('removes orientationchange listener from window with viewPortOrientationChanged handler', async () => {
|
|
619
798
|
specPopover.removeViewportListeners();
|
|
620
799
|
expect(windowRemoveEventListenerSpy).toHaveBeenCalledWith('orientationchange', specPopover.viewPortOrientationChanged);
|
|
621
800
|
});
|
|
@@ -805,101 +984,5 @@ describe('popover', () => {
|
|
|
805
984
|
});
|
|
806
985
|
});
|
|
807
986
|
});
|
|
808
|
-
describe('when in a module', () => {
|
|
809
|
-
let specPopover;
|
|
810
|
-
let windowSpy;
|
|
811
|
-
let controlElement;
|
|
812
|
-
let containerElement;
|
|
813
|
-
beforeEach(async () => {
|
|
814
|
-
specPopover = new Q2Popover();
|
|
815
|
-
windowSpy = jest.spyOn(window, 'top', 'get').mockReturnValue({});
|
|
816
|
-
window.Tecton = sampleTectonWindow;
|
|
817
|
-
expect(specPopover.isModule).toBe(true);
|
|
818
|
-
controlElement = document.createElement('div');
|
|
819
|
-
specPopover.controlElement = controlElement;
|
|
820
|
-
containerElement = document.createElement('div');
|
|
821
|
-
specPopover.containerElement = containerElement;
|
|
822
|
-
});
|
|
823
|
-
afterEach(() => {
|
|
824
|
-
windowSpy.mockRestore();
|
|
825
|
-
});
|
|
826
|
-
describe("when the module is taller than the window's viewport", () => {
|
|
827
|
-
beforeEach(() => {
|
|
828
|
-
specPopover.open = true;
|
|
829
|
-
window.visualViewport = { height: 1200 };
|
|
830
|
-
});
|
|
831
|
-
it('sets the direction to down when control element has more space below it', async () => {
|
|
832
|
-
const controlSpy = jest.spyOn(controlElement, 'getBoundingClientRect').mockReturnValue({
|
|
833
|
-
top: 20,
|
|
834
|
-
bottom: 70,
|
|
835
|
-
});
|
|
836
|
-
await specPopover.determinePopDirection();
|
|
837
|
-
expect(containerElement.style.getPropertyValue('--comp-pop-max-height')).toBe('700px');
|
|
838
|
-
expect(specPopover.currentDirection).toBe('down');
|
|
839
|
-
controlSpy.mockRestore();
|
|
840
|
-
});
|
|
841
|
-
it('sets the direction to up when control element has more space above it', async () => {
|
|
842
|
-
const controlSpy = jest.spyOn(controlElement, 'getBoundingClientRect').mockReturnValue({
|
|
843
|
-
top: 600,
|
|
844
|
-
bottom: 650,
|
|
845
|
-
});
|
|
846
|
-
await specPopover.determinePopDirection();
|
|
847
|
-
expect(containerElement.style.getPropertyValue('--comp-pop-max-height')).toBe('590px');
|
|
848
|
-
expect(specPopover.currentDirection).toBe('up');
|
|
849
|
-
controlSpy.mockRestore();
|
|
850
|
-
});
|
|
851
|
-
describe('when the outletOffset is less than 0', () => {
|
|
852
|
-
beforeEach(() => {
|
|
853
|
-
window.Tecton = Object.assign(Object.assign({}, sampleTectonWindow), { platformDimensions: Object.assign(Object.assign({}, samplePlatformDimensions), { outletOffset: -50 }) });
|
|
854
|
-
});
|
|
855
|
-
it('sets the direction to down when control element has more space below it', async () => {
|
|
856
|
-
const controlSpy = jest.spyOn(controlElement, 'getBoundingClientRect').mockReturnValue({
|
|
857
|
-
top: 20,
|
|
858
|
-
bottom: 70,
|
|
859
|
-
});
|
|
860
|
-
await specPopover.determinePopDirection();
|
|
861
|
-
expect(containerElement.style.getPropertyValue('--comp-pop-max-height')).toBe('770px');
|
|
862
|
-
expect(specPopover.currentDirection).toBe('down');
|
|
863
|
-
controlSpy.mockRestore();
|
|
864
|
-
});
|
|
865
|
-
it('sets the direction to up when control element has more space above it', async () => {
|
|
866
|
-
const controlSpy = jest.spyOn(controlElement, 'getBoundingClientRect').mockReturnValue({
|
|
867
|
-
top: 600,
|
|
868
|
-
bottom: 650,
|
|
869
|
-
});
|
|
870
|
-
await specPopover.determinePopDirection();
|
|
871
|
-
expect(containerElement.style.getPropertyValue('--comp-pop-max-height')).toBe('540px');
|
|
872
|
-
expect(specPopover.currentDirection).toBe('up');
|
|
873
|
-
controlSpy.mockRestore();
|
|
874
|
-
});
|
|
875
|
-
});
|
|
876
|
-
});
|
|
877
|
-
describe("when the module is shorter than the window's viewport", () => {
|
|
878
|
-
beforeEach(() => {
|
|
879
|
-
specPopover.open = true;
|
|
880
|
-
window.visualViewport = { height: 600 };
|
|
881
|
-
});
|
|
882
|
-
it('sets the direction to down when control element has more space below it', async () => {
|
|
883
|
-
const controlSpy = jest.spyOn(controlElement, 'getBoundingClientRect').mockReturnValue({
|
|
884
|
-
top: 20,
|
|
885
|
-
bottom: 70,
|
|
886
|
-
});
|
|
887
|
-
await specPopover.determinePopDirection();
|
|
888
|
-
expect(containerElement.style.getPropertyValue('--comp-pop-max-height')).toBe('520px');
|
|
889
|
-
expect(specPopover.currentDirection).toBe('down');
|
|
890
|
-
controlSpy.mockRestore();
|
|
891
|
-
});
|
|
892
|
-
it('sets the direction to up when control element has more space above it', async () => {
|
|
893
|
-
const controlSpy = jest.spyOn(controlElement, 'getBoundingClientRect').mockReturnValue({
|
|
894
|
-
top: 500,
|
|
895
|
-
bottom: 550,
|
|
896
|
-
});
|
|
897
|
-
await specPopover.determinePopDirection();
|
|
898
|
-
expect(containerElement.style.getPropertyValue('--comp-pop-max-height')).toBe('490px');
|
|
899
|
-
expect(specPopover.currentDirection).toBe('up');
|
|
900
|
-
controlSpy.mockRestore();
|
|
901
|
-
});
|
|
902
|
-
});
|
|
903
|
-
});
|
|
904
987
|
});
|
|
905
988
|
//# sourceMappingURL=q2-popover-test.spec.js.map
|