@verbb/plugin-kit-web 2.0.22 → 2.0.24

package/dist-loader/chunks/{pk-combobox-DBvcyxRC.js → pk-combobox-S_tpNUHK.js}

@@ -1,18 +1,18 @@
-import { d as registerDismissible, f as unregisterDismissible, n as uniqueId, s as scrollIntoView, t as LiveRegion, u as isTopDismissible } from "./pk-a11y-CjB4-U-R.js";
-import { a as o, c as r, f as A, i as e, l as n, m as i, p as b, s as e$1, u as customElement } from "./lit-DpLik9Rf.js";
-import { c as __decorate, i as PkFormAssociatedElement, s as iconStyles } from "./pk-base-B2MqxErC.js";
-import { X as xmark, h as chevronDown } from "./svg-Bz-bXZn7.js";
-import { t as MirrorValidator } from "./mirror-validator-C5XrXPaq.js";
-import { t as HasSlotController } from "./has-slot-BGJeJdHr.js";
-import { t as PkClearEvent } from "./pk-clear-BMZUzwDt.js";
-import { n as renderIconHtml } from "./render-Bnzcxfss.js";
-import { i as PkShowEvent, n as PkAfterShowEvent, r as PkHideEvent, t as PkAfterHideEvent } from "./overlay-lifecycle-C3tSQ3UR.js";
-import { i as waitForPopupReposition, r as syncPopupPlacementAnimation } from "./popup-placement-animation-WlEXnS85.js";
-import { t as popupContentAnimationStyles } from "./popup-content-animation.styles-duCg9-CH.js";
-import "./pk-popup-CUuGs8r_.js";
-import { n as isPointerInsideOverlay, t as isEventInsideOverlay } from "./popup-pointer-Ck28WdVP.js";
-import { a as isListboxTypeToSelectKey, i as handleListboxKeyDown, n as LISTBOX_NAVIGATION_KEYS } from "./sync-listbox-separators-Ch5krDUs.js";
-import { i as waitForPopupContentExitAnimation, n as AsyncOptionFetcher, r as syncFilteredOptions, t as matchesOptionFilter } from "./option-filter-Bc5aNNT0.js";
+import "./pk-popup-CeyruJFh.js";
+import { d as registerDismissible, f as unregisterDismissible, n as uniqueId, s as scrollIntoView, t as LiveRegion, u as isTopDismissible } from "./pk-a11y-mGj0G5AE.js";
+import { a as e$1, c as customElement, f as A, i as e, l as o, m as i, o as r, p as b, s as n } from "./lit-B6nFKgbW.js";
+import { c as __decorate, i as PkFormAssociatedElement, s as iconStyles } from "./pk-base-BGegy7-X.js";
+import { h as chevronDown, tt as xmark } from "./svg-BRgqS9vA.js";
+import { n as renderIconHtml } from "./render-D9G_a_c2.js";
+import { t as HasSlotController } from "./has-slot-DJv86HKx.js";
+import { t as MirrorValidator } from "./mirror-validator-BkZlEv1Z.js";
+import { t as PkClearEvent } from "./pk-clear-DHxP_2cm.js";
+import { i as PkShowEvent, n as PkAfterShowEvent, r as PkHideEvent, t as PkAfterHideEvent } from "./overlay-lifecycle-C582MGBJ.js";
+import { i as waitForPopupReposition, r as syncPopupPlacementAnimation } from "./popup-placement-animation-ClUYI79z.js";
+import { t as popupContentAnimationStyles } from "./popup-content-animation.styles-BtUVJg82.js";
+import { n as isPointerInsideOverlay, t as isEventInsideOverlay } from "./popup-pointer-Bh_d205v.js";
+import { a as isListboxTypeToSelectKey, i as handleListboxKeyDown, n as LISTBOX_NAVIGATION_KEYS } from "./sync-listbox-separators-saLEtPpJ.js";
+import { i as waitForPopupContentExitAnimation, n as AsyncOptionFetcher, r as syncFilteredOptions, t as matchesOptionFilter } from "./option-filter-BkKyBg8L.js";
 //#region src/events/pk-create.ts
 /** Fired before a combobox creates a new option — mirrors  `pk-create`. */
 var PkCreateEvent = class extends Event {
@@ -1408,9 +1408,10 @@ var PkCombobox = class PkCombobox extends PkFormAssociatedElement {
 			this.syncHasValueAttribute();
 			this.emitValueChange();
 		}
-		if (this.shouldReturnFocusToInput(source)) if (this.usesPopupMode) this.popupTrigger?.focus({ preventScroll: true });
-		else this.activeInput?.focus({ preventScroll: true });
-		else {
+		if (this.shouldReturnFocusToInput(source)) {
+			if (this.usesPopupMode) this.popupTrigger?.focus({ preventScroll: true });
+			else this.activeInput?.focus({ preventScroll: true });
+		} else {
 			this.activeInput?.blur();
 			this.popupTrigger?.blur();
 		}

package/dist-loader/chunks/{pk-connect.styles-k61snd3X.js → pk-connect.styles-B5qe5yQB.js}

@@ -1,4 +1,4 @@
-import { m as i } from "./lit-DpLik9Rf.js";
+import { m as i } from "./lit-B6nFKgbW.js";
 //#region ../plugin-kit-core/dist/utils/forms.js
 var nl2br = (str) => {
 	return str.replace(/\n/g, "<br>");

package/dist-loader/chunks/pk-copy-button-D6tPuhJ3.js

@@ -0,0 +1,198 @@
+import { c as customElement, m as i, o as r, p as b, s as n, u as o } from "./lit-B6nFKgbW.js";
+import { c as __decorate, l as PkElement } from "./pk-base-BGegy7-X.js";
+import { C as copy, m as check } from "./svg-BRgqS9vA.js";
+import { n as renderIconHtml } from "./render-D9G_a_c2.js";
+import { t as HasSlotController } from "./has-slot-DJv86HKx.js";
+import "./pk-button-DV9Tk5Pd.js";
+//#region src/events/pk-copy.ts
+/** Emitted when copy-button successfully copies text. */
+var PkCopyEvent = class extends Event {
+	constructor(value) {
+		super("pk-copy", {
+			bubbles: true,
+			cancelable: false,
+			composed: true
+		});
+		this.detail = { value };
+	}
+};
+/** Emitted when copy-button fails to copy text. */
+var PkCopyErrorEvent = class extends Event {
+	constructor() {
+		super("pk-copy-error", {
+			bubbles: true,
+			cancelable: false,
+			composed: true
+		});
+	}
+};
+//#endregion
+//#region src/utils/copy-to-clipboard.ts
+/** Writes text to the clipboard — requires a secure context in most browsers. */
+async function copyToClipboard(value) {
+	await navigator.clipboard.writeText(value);
+}
+/** Resolves the string to copy from a `from` selector (from selector). */
+function resolveCopyValue(root, from, fallbackValue) {
+	if (!from) return fallbackValue || null;
+	const isProperty = from.includes(".");
+	const isAttribute = from.includes("[") && from.includes("]");
+	let id = from;
+	let field = "";
+	if (isProperty) [id, field] = from.trim().split(".");
+	else if (isAttribute) [id, field] = from.trim().replace(/\]$/, "").split("[");
+	const target = "getElementById" in root ? root.getElementById(id) : null;
+	if (!target) return null;
+	if (isAttribute) return target.getAttribute(field) ?? "";
+	if (isProperty) {
+		const propertyValue = target[field];
+		return propertyValue == null ? "" : String(propertyValue);
+	}
+	return target.textContent ?? "";
+}
+//#endregion
+//#region src/components/copy-button/pk-copy-button.styles.ts
+var pkCopyButtonStyles = i`
+    @layer pk-component {
+        :host {
+            display: inline-block;
+        }
+
+        /* Match React CopyButton size="icon" — square, no horizontal padding. */
+        pk-button::part(base) {
+            padding-inline: 0;
+            width: var(--pk-btn-height-default);
+            min-width: var(--pk-btn-height-default);
+            border-color: var(--pk-copy-button-border-color);
+            border-radius: var(--pk-copy-button-radius);
+            background: var(--pk-copy-button-background);
+            color: var(--pk-copy-button-color);
+        }
+
+        pk-button::part(base):hover:not(:disabled) {
+            border-color: var(
+                --pk-copy-button-hover-border-color,
+                var(--pk-copy-button-border-color)
+            );
+            background: var(--pk-copy-button-hover-background);
+            color: var(--pk-copy-button-hover-color, var(--pk-copy-button-color));
+        }
+
+        /*
+         * In-control trailing action (slot=end on pk-input, etc.): same family as
+         * combobox expand/clear and image-browser clear — flex-reserved hit box
+         * flush to the field edge, glyph sized via --pk-input-decoration-size.
+         */
+        :host([slot='end']) {
+            display: inline-flex;
+            align-self: stretch;
+            height: auto;
+            /* size=none buttons resolve --pk-btn-icon-size: 1em against this. */
+            font-size: var(--pk-input-decoration-size, 0.75rem);
+        }
+
+        :host([slot='end']) pk-button {
+            display: flex;
+            height: 100%;
+        }
+
+        :host([slot='end']) pk-button::part(base) {
+            box-sizing: border-box;
+            width: calc(
+                var(--pk-input-decoration-size, 0.75rem) + var(--pk-input-padding-inline, 8px)
+            );
+            min-width: calc(
+                var(--pk-input-decoration-size, 0.75rem) + var(--pk-input-padding-inline, 8px)
+            );
+            height: 100%;
+            min-height: 100%;
+            padding: 0;
+            border-width: 0;
+            border-radius: 0;
+            background: transparent;
+            color: var(--pk-color-gray-600);
+        }
+
+        :host([slot='end']) pk-button::part(base):hover:not(:disabled) {
+            color: var(--pk-color-gray-800);
+        }
+    }
+`;
+//#endregion
+//#region src/components/copy-button/pk-copy-button.ts
+var SUCCESS_ICON = renderIconHtml(check).replace("<svg", "<svg slot=\"start\" part=\"success-icon\"");
+var COPY_ICON = renderIconHtml(copy).replace("<svg", "<svg slot=\"start\" part=\"copy-icon\"");
+var COPIED_RESET_MS = 2e3;
+var PkCopyButton = class PkCopyButton extends PkElement {
+	constructor(..._args) {
+		super(..._args);
+		this.hasSlotController = new HasSlotController(this, "icon");
+		this.value = "";
+		this.from = "";
+		this.disabled = false;
+		this.variant = "transparent";
+		this.ariaLabel = "Copy";
+		this.copiedLabel = "Copied";
+		this.copied = false;
+		this.resetCopied = () => {
+			this.copied = false;
+		};
+	}
+	static {
+		this.styles = pkCopyButtonStyles;
+	}
+	disconnectedCallback() {
+		window.clearTimeout(this.resetTimer);
+		super.disconnectedCallback();
+	}
+	scheduleReset() {
+		window.clearTimeout(this.resetTimer);
+		this.resetTimer = window.setTimeout(this.resetCopied, COPIED_RESET_MS);
+	}
+	/** Copy the configured value and emit the corresponding result event. */
+	async copy() {
+		if (this.disabled) return;
+		const valueToCopy = resolveCopyValue(this.getRootNode(), this.from, this.value);
+		if (valueToCopy == null || valueToCopy === "") {
+			this.dispatchEvent(new PkCopyErrorEvent());
+			return;
+		}
+		try {
+			await copyToClipboard(valueToCopy);
+			this.copied = true;
+			this.scheduleReset();
+			this.dispatchEvent(new PkCopyEvent(valueToCopy));
+		} catch {
+			this.dispatchEvent(new PkCopyErrorEvent());
+		}
+	}
+	render() {
+		const inControl = this.getAttribute("slot") === "end";
+		return b`
+            <pk-button
+                part="button"
+                variant=${inControl ? "none" : this.variant}
+                size=${inControl ? "none" : "default"}
+                ?icon=${inControl}
+                aria-label=${this.copied ? this.copiedLabel : this.ariaLabel}
+                ?disabled=${this.disabled}
+                @click=${this.copy}
+            >
+                ${this.copied ? o(SUCCESS_ICON) : this.hasSlotController.test("icon") ? b`<slot name="icon" slot="start"></slot>` : o(COPY_ICON)}
+            </pk-button>
+        `;
+	}
+};
+__decorate([n()], PkCopyButton.prototype, "value", void 0);
+__decorate([n()], PkCopyButton.prototype, "from", void 0);
+__decorate([n({
+	type: Boolean,
+	reflect: true
+})], PkCopyButton.prototype, "disabled", void 0);
+__decorate([n({ reflect: true })], PkCopyButton.prototype, "variant", void 0);
+__decorate([n({ attribute: "aria-label" })], PkCopyButton.prototype, "ariaLabel", void 0);
+__decorate([n({ attribute: "copied-label" })], PkCopyButton.prototype, "copiedLabel", void 0);
+__decorate([r()], PkCopyButton.prototype, "copied", void 0);
+PkCopyButton = __decorate([customElement("pk-copy-button")], PkCopyButton);
+//#endregion
+export { PkCopyEvent as i, copyToClipboard as n, PkCopyErrorEvent as r, PkCopyButton as t };

package/dist-loader/chunks/{pk-date-picker-CYLpYIji.js → pk-date-picker-C0y4sfSf.js}

@@ -1,18 +1,18 @@
-import { d as registerDismissible, f as unregisterDismissible, n as uniqueId, u as isTopDismissible } from "./pk-a11y-CjB4-U-R.js";
-import { a as o, c as r, f as A, i as e, l as n, m as i, p as b, s as e$1, u as customElement } from "./lit-DpLik9Rf.js";
-import { c as __decorate, i as PkFormAssociatedElement, n as formControlStyles, s as iconStyles } from "./pk-base-B2MqxErC.js";
-import { X as xmark, p as calendar } from "./svg-Bz-bXZn7.js";
-import { t as MirrorValidator } from "./mirror-validator-C5XrXPaq.js";
-import { t as RequiredValidator } from "./required-validator-0XwZtX9k.js";
-import { t as HasSlotController } from "./has-slot-BGJeJdHr.js";
-import { t as PkClearEvent } from "./pk-clear-BMZUzwDt.js";
-import { n as readLegacyInstructions } from "./field-labels-D3lKQ2nq.js";
-import { n as renderIconHtml } from "./render-Bnzcxfss.js";
-import { i as PkShowEvent, n as PkAfterShowEvent, r as PkHideEvent, t as PkAfterHideEvent } from "./overlay-lifecycle-C3tSQ3UR.js";
-import { i as waitForPopupReposition } from "./popup-placement-animation-WlEXnS85.js";
-import "./pk-popup-CUuGs8r_.js";
-import { n as isPointerInsideOverlay } from "./popup-pointer-Ck28WdVP.js";
-import { a as parseIsoDate, i as parseDateList, n as coerceToDate, o as parseRange, r as formatIsoDate } from "./pk-calendar-BuSULJCU.js";
+import "./pk-popup-CeyruJFh.js";
+import { d as registerDismissible, f as unregisterDismissible, n as uniqueId, u as isTopDismissible } from "./pk-a11y-mGj0G5AE.js";
+import { a as e$1, c as customElement, f as A, i as e, l as o, m as i, o as r, p as b, s as n } from "./lit-B6nFKgbW.js";
+import { c as __decorate, i as PkFormAssociatedElement, n as formControlStyles, s as iconStyles } from "./pk-base-BGegy7-X.js";
+import { p as calendar, tt as xmark } from "./svg-BRgqS9vA.js";
+import { n as renderIconHtml } from "./render-D9G_a_c2.js";
+import { t as HasSlotController } from "./has-slot-DJv86HKx.js";
+import { t as MirrorValidator } from "./mirror-validator-BkZlEv1Z.js";
+import { t as RequiredValidator } from "./required-validator-I58oJGZ3.js";
+import { t as PkClearEvent } from "./pk-clear-DHxP_2cm.js";
+import { n as readLegacyInstructions } from "./field-labels-pY-gQDwQ.js";
+import { i as PkShowEvent, n as PkAfterShowEvent, r as PkHideEvent, t as PkAfterHideEvent } from "./overlay-lifecycle-C582MGBJ.js";
+import { i as waitForPopupReposition } from "./popup-placement-animation-ClUYI79z.js";
+import { n as isPointerInsideOverlay } from "./popup-pointer-Bh_d205v.js";
+import { a as parseIsoDate, i as parseDateList, n as coerceToDate, o as parseRange, r as formatIsoDate } from "./pk-calendar-C0xpIVIw.js";
 //#region src/utils/host-date.ts
 function getCraft() {
 	return globalThis.Craft;

package/dist-loader/chunks/{pk-dialog-BtrH5Ke0.js → pk-dialog-BJs5fVHS.js}

@@ -1,10 +1,10 @@
-import { c as unlockBodyScrolling, d as registerDismissible, f as unregisterDismissible, o as lockBodyScrolling, u as isTopDismissible } from "./pk-a11y-CjB4-U-R.js";
-import { a as o, c as r, f as A, i as e, l as n, m as i, p as b, s as e$1, u as customElement } from "./lit-DpLik9Rf.js";
-import { c as __decorate, l as PkElement } from "./pk-base-B2MqxErC.js";
-import { X as xmark } from "./svg-Bz-bXZn7.js";
-import { n as renderIconHtml } from "./render-Bnzcxfss.js";
-import { i as PkShowEvent, n as PkAfterShowEvent, r as PkHideEvent, t as PkAfterHideEvent } from "./overlay-lifecycle-C3tSQ3UR.js";
-import { t as animateWithClass } from "./animate-with-class-DT0jwaR_.js";
+import { c as unlockBodyScrolling, d as registerDismissible, f as unregisterDismissible, o as lockBodyScrolling, u as isTopDismissible } from "./pk-a11y-mGj0G5AE.js";
+import { a as e$1, c as customElement, f as A, i as e, l as o, m as i, o as r, p as b, s as n } from "./lit-B6nFKgbW.js";
+import { c as __decorate, l as PkElement } from "./pk-base-BGegy7-X.js";
+import { tt as xmark } from "./svg-BRgqS9vA.js";
+import { n as renderIconHtml } from "./render-D9G_a_c2.js";
+import { i as PkShowEvent, n as PkAfterShowEvent, r as PkHideEvent, t as PkAfterHideEvent } from "./overlay-lifecycle-C582MGBJ.js";
+import { t as animateWithClass } from "./animate-with-class-CjTZI0NU.js";
 //#region src/utils/craft-host-modal.ts
 /**
 * Craft CP Garnish modals (element selector, asset picker, …) live in normal

package/dist-loader/chunks/{pk-dropdown-item-D8tfEU-k.js → pk-dropdown-item-Bs5NZDRh.js}

@@ -1,10 +1,10 @@
-import { a as o, c as r, f as A, l as n, m as i, p as b, s as e, u as customElement } from "./lit-DpLik9Rf.js";
-import { c as __decorate, l as PkElement } from "./pk-base-B2MqxErC.js";
-import { _ as chevronRight, m as check } from "./svg-Bz-bXZn7.js";
-import { t as HasSlotController } from "./has-slot-BGJeJdHr.js";
-import { n as renderIconHtml } from "./render-Bnzcxfss.js";
-import { i as waitForPopupReposition, r as syncPopupPlacementAnimation } from "./popup-placement-animation-WlEXnS85.js";
-import { t as popupContentAnimationStyles } from "./popup-content-animation.styles-duCg9-CH.js";
+import { a as e, c as customElement, f as A, l as o, m as i, o as r, p as b, s as n } from "./lit-B6nFKgbW.js";
+import { c as __decorate, l as PkElement } from "./pk-base-BGegy7-X.js";
+import { _ as chevronRight, m as check } from "./svg-BRgqS9vA.js";
+import { n as renderIconHtml } from "./render-D9G_a_c2.js";
+import { t as HasSlotController } from "./has-slot-DJv86HKx.js";
+import { i as waitForPopupReposition, r as syncPopupPlacementAnimation } from "./popup-placement-animation-ClUYI79z.js";
+import { t as popupContentAnimationStyles } from "./popup-content-animation.styles-BtUVJg82.js";
 //#region src/components/dropdown-menu/dropdown-menu-size.styles.ts
 var dropdownMenuSizeTokens = {
 	default: i`
@@ -381,8 +381,10 @@ var PkDropdownItem = class PkDropdownItem extends PkElement {
 	updated(changed) {
 		if (changed.has("type") || changed.has("checked")) this.syncRole();
 		if (changed.has("submenuOpen") || changed.size === 0) this.syncSubmenuAria();
-		if (changed.has("submenuOpen")) if (this.submenuOpen) this.ensureSubmenuSurface();
-		else this.submenuAnimated = false;
+		if (changed.has("submenuOpen")) {
+			if (this.submenuOpen) this.ensureSubmenuSurface();
+			else this.submenuAnimated = false;
+		}
 	}
 	/** Light-DOM `slot="submenu"` — public for menu keyboard (`hasSubmenu`). */
 	hasSubmenu() {

package/dist-loader/chunks/{pk-dropdown-label-TbLj4bHK.js → pk-dropdown-label-Cpl9-bzB.js}

@@ -1,5 +1,5 @@
-import { m as i, p as b, u as customElement } from "./lit-DpLik9Rf.js";
-import { c as __decorate, l as PkElement } from "./pk-base-B2MqxErC.js";
+import { c as customElement, m as i, p as b } from "./lit-B6nFKgbW.js";
+import { c as __decorate, l as PkElement } from "./pk-base-BGegy7-X.js";
 //#region src/components/dropdown-menu/pk-dropdown-label.styles.ts
 var pkDropdownLabelStyles = i`
     @layer pk-component {

package/dist-loader/chunks/{pk-dropdown-menu-C4GDW5pE.js → pk-dropdown-menu-CLrfuD3i.js}

@@ -1,12 +1,12 @@
-import { d as registerDismissible, f as unregisterDismissible, r as activeElements, u as isTopDismissible } from "./pk-a11y-CjB4-U-R.js";
-import { l as n, m as i, p as b, s as e, u as customElement } from "./lit-DpLik9Rf.js";
-import { c as __decorate, l as PkElement } from "./pk-base-B2MqxErC.js";
-import { r as buttonGroupCornerRoleStyles } from "./button-group-item.styles-CsBQ3Cyh.js";
-import { i as PkShowEvent, n as PkAfterShowEvent, r as PkHideEvent, t as PkAfterHideEvent } from "./overlay-lifecycle-C3tSQ3UR.js";
-import { t as animateWithClass } from "./animate-with-class-DT0jwaR_.js";
-import { i as waitForPopupReposition } from "./popup-placement-animation-WlEXnS85.js";
-import { n as dropdownMenuHostSizeStyles, r as dropdownMenuPanelSizeStyles, t as PkDropdownItem } from "./pk-dropdown-item-D8tfEU-k.js";
-import { n as resolveElementById } from "./pk-popup-CUuGs8r_.js";
+import { n as resolveElementById } from "./pk-popup-CeyruJFh.js";
+import { d as registerDismissible, f as unregisterDismissible, r as activeElements, u as isTopDismissible } from "./pk-a11y-mGj0G5AE.js";
+import { a as e, c as customElement, m as i, p as b, s as n } from "./lit-B6nFKgbW.js";
+import { c as __decorate, l as PkElement } from "./pk-base-BGegy7-X.js";
+import { r as buttonGroupCornerRoleStyles } from "./button-group-item.styles-BQbvE3sC.js";
+import { i as PkShowEvent, n as PkAfterShowEvent, r as PkHideEvent, t as PkAfterHideEvent } from "./overlay-lifecycle-C582MGBJ.js";
+import { t as animateWithClass } from "./animate-with-class-CjTZI0NU.js";
+import { i as waitForPopupReposition } from "./popup-placement-animation-ClUYI79z.js";
+import { n as dropdownMenuHostSizeStyles, r as dropdownMenuPanelSizeStyles, t as PkDropdownItem } from "./pk-dropdown-item-Bs5NZDRh.js";
 //#region src/components/dropdown-menu/pk-dropdown-menu.styles.ts
 /**
 * Dropdown panel motion —  `pk-dropdown` scale+fade, with transform
@@ -625,13 +625,15 @@ var PkDropdownMenu = class PkDropdownMenu extends PkElement {
 		this.menuElement.classList.remove("hide");
 		await animateWithClass(this.menuElement, "show");
 		const items = this.getItems();
-		if (items.length > 0) if (this.openedByKeyboard) this.setActiveItem(items, items[0]);
-		else {
-			items.forEach((item) => {
-				item.active = false;
-				item.removeAttribute("data-highlighted");
-			});
-			this.menuElement.focus({ preventScroll: true });
+		if (items.length > 0) {
+			if (this.openedByKeyboard) this.setActiveItem(items, items[0]);
+			else {
+				items.forEach((item) => {
+					item.active = false;
+					item.removeAttribute("data-highlighted");
+				});
+				this.menuElement.focus({ preventScroll: true });
+			}
 		}
 		this.openedByKeyboard = false;
 		this.dispatchEvent(new PkAfterShowEvent());
@@ -676,9 +678,10 @@ var PkDropdownMenu = class PkDropdownMenu extends PkElement {
 	}
 	render() {
 		const popupActive = this.hasUpdated ? this.popupElement?.active : this.open;
+		const externalAnchor = this.for ? this.getAnchor() : "";
 		return b`
             <pk-popup
-                .anchor=${this.for ? this.getAnchor() : ""}
+                .anchor=${externalAnchor}
                 placement=${this.placement}
                 .distance=${this.distance || this.sideOffset}
                 .skidding=${this.skidding}