[Popover] Unreasonable complex selectors with duplicate classes generated

[Westbrook]

spectrum-css/components/popover/index.css

Lines 319 to 346 in 3c7de5e

	/* right, left, start, end popover position with tip default to pointing right ▷ */
	&.spectrum-Popover--left,
	&.spectrum-Popover--left-bottom,
	&.spectrum-Popover--left-top,
	&.spectrum-Popover--right,
	&.spectrum-Popover--right-bottom,
	&.spectrum-Popover--right-top,
	&.spectrum-Popover--start,
	&.spectrum-Popover--start-top,
	&.spectrum-Popover--start-bottom,
	&.spectrum-Popover--end,
	&.spectrum-Popover--end-top,
	&.spectrum-Popover--end-bottom {
	.spectrum-Popover-tip {
	/* swap height and width for vertical triangle */
	inline-size: var(--mod-popover-pointer-height, var(--spectrum-popover-pointer-height));
	block-size: var(--mod-popover-pointer-width, var(--spectrum-popover-pointer-width));
	inset-block: 0;
	}
	/* left popover with tip pointing right ▷ */
	&.spectrum-Popover--left,
	&.spectrum-Popover--left-bottom,
	&.spectrum-Popover--left-top {
	.spectrum-Popover-tip {
	inset-inline: 100% auto;
	}
	}

This will generate selectors like .spectrum-Popover--withTip.spectrum-Popover--left.spectrum-Popover--left .spectrum-Popover-tip wherein the spectrum-Popover--left is duplicated.

Can this be smoothed out? It creates additional difficult when processing the output downstream.

[pfulton]

Tracking this in Jira via CSS-750