@primer/view-components 0.1.6-rc.277c7eae → 0.1.6-rc.396599d3

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/package.json

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

package/static/info_arch.json

@@ -647,13 +647,13 @@
       },
       {
         "name": "with_show_button",
-        "description": "Button to activate the menu. This may be a {{#link_to_component}}Primer::ButtonComponent{{/link_to_component}} or {{#link_to_component}}Primer::IconButton{{/link_to_component}}.",
+        "description": "Button to activate the menu.",
         "parameters": [
           {
-            "name": "icon",
-            "type": "Symbol",
+            "name": "system_arguments",
+            "type": "Hash",
             "default": "N/A",
-            "description": "Set this to an [Octicon name](https://primer.style/octicons/) when you want to render an `IconButton`. Otherwise, this renders as a {{#link_to_component}}Primer::ButtonComponent{{/link_to_component}}."
+            "description": "The arguments accepted by {{#link_to_component}}Primer::Alpha::Overlay{{/link_to_component}}'s `show_button` slot."
           }
         ]
       },
@@ -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",
@@ -3347,10 +3352,22 @@
         "description": "Optional button to open the Overlay.",
         "parameters": [
           {
-            "name": "system_arguments",
+            "name": "icon",
+            "type": "String",
+            "default": "N/A",
+            "description": "Name of {{link_to_octicons}} to use instead of text. If provided, a {{#link_to_component}}Primer::Beta::IconButton{{/link_to_component}} will be rendered. Otherwise a {{#link_to_component}}Primer::Beta::Button{{/link_to_component}} will be rendered."
+          },
+          {
+            "name": "controls",
+            "type": "String",
+            "default": "N/A",
+            "description": "The ID of the menu this button controls. Used internally."
+          },
+          {
+            "name": "button_arguments",
             "type": "Hash",
             "default": "N/A",
-            "description": "The same arguments as {{#link_to_component}}Primer::ButtonComponent{{/link_to_component}}."
+            "description": "The arguments accepted by {{#link_to_component}}Primer::Beta::Button{{/link_to_component}} or {{#link_to_component}}Primer::Beta::IconButton{{/link_to_component}} depending on the presence of the `icon:` argument."
           }
         ]
       },
@@ -3364,6 +3381,12 @@
             "default": "N/A",
             "description": "Show a divider between the header and body."
           },
+          {
+            "name": "size",
+            "type": "Symbol",
+            "default": "N/A",
+            "description": "One of One of `:auto`, `:large`, `:medium`, `:medium_portrait`, `:small`, or `:xlarge`.."
+          },
           {
             "name": "visually_hide_title",
             "type": "Boolean",

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",