@primer/view-components 0.1.6-rc.e9eb5237 → 0.1.6-rc.fbd3190c

package/app/components/primer/alpha/action_menu/action_menu_element.d.ts

@@ -10,6 +10,7 @@ export declare class ActionMenuElement extends HTMLElement {
     set dynamicLabel(value: boolean);
     get popoverElement(): HTMLElement | null;
     get invokerElement(): HTMLElement | null;
+    get invokerLabel(): HTMLElement | null;
     connectedCallback(): void;
     disconnectedCallback(): void;
     handleEvent(event: Event): void;

package/app/components/primer/alpha/action_menu/action_menu_element.js

@@ -68,6 +68,11 @@ export class ActionMenuElement extends HTMLElement {
         }
         return null;
     }
+    get invokerLabel() {
+        if (!this.invokerElement)
+            return null;
+        return this.invokerElement.querySelector('.Button-label');
+    }
     connectedCallback() {
         const { signal } = (__classPrivateFieldSet(this, _ActionMenuElement_abortController, new AbortController(), "f"));
         this.addEventListener('keydown', this, { signal });
@@ -130,21 +135,21 @@ export class ActionMenuElement extends HTMLElement {
 _ActionMenuElement_abortController = new WeakMap(), _ActionMenuElement_originalLabel = new WeakMap(), _ActionMenuElement_instances = new WeakSet(), _ActionMenuElement_setDynamicLabel = function _ActionMenuElement_setDynamicLabel() {
     if (!this.dynamicLabel)
         return;
-    const invoker = this.invokerElement;
-    if (!invoker)
+    const invokerLabel = this.invokerLabel;
+    if (!invokerLabel)
         return;
-    const item = this.querySelector('[aria-checked=true]');
-    if (item && this.dynamicLabel) {
-        __classPrivateFieldSet(this, _ActionMenuElement_originalLabel, __classPrivateFieldGet(this, _ActionMenuElement_originalLabel, "f") || (invoker.textContent || ''), "f");
+    const itemLabel = this.querySelector('[aria-checked=true] .ActionListItem-label');
+    if (itemLabel && this.dynamicLabel) {
+        __classPrivateFieldSet(this, _ActionMenuElement_originalLabel, __classPrivateFieldGet(this, _ActionMenuElement_originalLabel, "f") || (invokerLabel.textContent || ''), "f");
         const prefixSpan = document.createElement('span');
         prefixSpan.classList.add('color-fg-muted');
         const contentSpan = document.createElement('span');
         prefixSpan.textContent = this.dynamicLabelPrefix;
-        contentSpan.textContent = item.textContent || '';
-        invoker.replaceChildren(prefixSpan, contentSpan);
+        contentSpan.textContent = itemLabel.textContent || '';
+        invokerLabel.replaceChildren(prefixSpan, contentSpan);
     }
     else {
-        invoker.textContent = __classPrivateFieldGet(this, _ActionMenuElement_originalLabel, "f");
+        invokerLabel.textContent = __classPrivateFieldGet(this, _ActionMenuElement_originalLabel, "f");
     }
 }, _ActionMenuElement_isEnterKeydown = function _ActionMenuElement_isEnterKeydown(event) {
     return (event instanceof KeyboardEvent &&

package/app/components/primer/alpha/modal_dialog.js

@@ -20,13 +20,7 @@ function focusIfNeeded(elem) {
 const overlayStack = [];
 function clickHandler(event) {
     const target = event.target;
-    let button = null;
-    if (target instanceof HTMLButtonElement) {
-        button = target;
-    }
-    else {
-        button = target === null || target === void 0 ? void 0 : target.querySelector('button');
-    }
+    const button = target === null || target === void 0 ? void 0 : target.closest('button');
     if (!button)
         return;
     // If the user is clicking a valid dialog trigger

package/app/components/primer/alpha/overlay.css

@@ -1 +1 @@
-.Overlay[popover]{border-width:0;padding:0;position:absolute;width:min(192px,100vw - 2rem)}.Overlay[popover]:not(:open){display:none}anchored-position{display:block}
+.Overlay[popover]{border-width:0;min-width:192px;padding:0;position:absolute}.Overlay[popover]:not(:open){display:none}anchored-position{display:block}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@primer/view-components",
-  "version": "0.1.6-rc.e9eb5237",
+  "version": "0.1.6-rc.fbd3190c",
   "description": "ViewComponents for the Primer Design System",
   "main": "app/assets/javascripts/primer_view_components.js",
   "module": "app/components/primer/primer.js",

package/static/constants.json

@@ -102,18 +102,12 @@
     ]
   },
   "Primer::Alpha::ActionMenu::List": {
-    "DEFAULT_ITEM_TAG": "span",
-    "ITEM_ACTION_OPTIONS": [
-      "classes",
-      "onclick",
-      "href",
-      "value"
-    ],
+    "DEFAULT_ITEM_TAG": "button",
     "ITEM_TAG_OPTIONS": [
       "a",
       "button",
       "clipboard-copy",
-      "span"
+      "button"
     ]
   },
   "Primer::Alpha::AutoComplete": {

package/static/info_arch.json

@@ -695,6 +695,11 @@
         "preview_path": "/lookbook/preview/primer/alpha/action_menu/playground",
         "name": "playground"
       },
+      {
+        "inspect_path": "/lookbook/inspect/primer/alpha/action_menu/content_labels",
+        "preview_path": "/lookbook/preview/primer/alpha/action_menu/content_labels",
+        "name": "content_labels"
+      },
       {
         "inspect_path": "/lookbook/inspect/primer/alpha/action_menu/default",
         "preview_path": "/lookbook/preview/primer/alpha/action_menu/default",

package/static/previews.json

@@ -123,6 +123,11 @@
         "preview_path": "/lookbook/preview/primer/alpha/action_menu/playground",
         "name": "playground"
       },
+      {
+        "inspect_path": "/lookbook/inspect/primer/alpha/action_menu/content_labels",
+        "preview_path": "/lookbook/preview/primer/alpha/action_menu/content_labels",
+        "name": "content_labels"
+      },
       {
         "inspect_path": "/lookbook/inspect/primer/alpha/action_menu/default",
         "preview_path": "/lookbook/preview/primer/alpha/action_menu/default",