@primer/view-components 0.1.9-rc.c91f6e8b → 0.1.9-rc.ca2fbe65

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

@@ -31,6 +31,10 @@ function clickHandler(event) {
         if (dialog instanceof ModalDialogElement) {
             dialog.openButton = button;
             dialog.show();
+            // A buttons default behaviour in some browsers it to send a pointer event
+            // If the behaviour is allowed through the dialog will be shown but then
+            // quickly hidden- as if it were never shown. This prevents that.
+            event.preventDefault();
             return;
         }
     }

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

@@ -1 +1 @@
-.Overlay[popover]{border-width:0;min-width:192px;padding:0;position:absolute}.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(:popover-open){display:none}anchored-position{display:block}

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

@@ -2,7 +2,7 @@
   "name": "alpha/overlay",
   "selectors": [
     ".Overlay[popover]",
-    ".Overlay[popover]:not(:open)",
+    ".Overlay[popover]:not(:popover-open)",
     "anchored-position"
   ]
 }

package/app/components/primer/focus_group.js

@@ -14,11 +14,11 @@ import '@oddbird/popover-polyfill';
 const menuItemSelector = '[role="menuitem"],[role="menuitemcheckbox"],[role="menuitemradio"]';
 const popoverSelector = (() => {
     try {
-        document.querySelector(':open');
-        return ':open';
+        document.querySelector(':popover-open');
+        return ':popover-open';
     }
     catch (_a) {
-        return '.\\:open';
+        return '.\\:popover-open';
     }
 })();
 const getMnemonicFor = (item) => { var _a; return (_a = item.textContent) === null || _a === void 0 ? void 0 : _a.trim()[0].toLowerCase(); };
@@ -132,9 +132,7 @@ export default class FocusGroupElement extends HTMLElement {
                     if ((el === null || el === void 0 ? void 0 : el.popover) === 'auto') {
                         el.showPopover();
                     }
-                    else {
-                        el = (el === null || el === void 0 ? void 0 : el.parentElement) || null;
-                    }
+                    el = (el === null || el === void 0 ? void 0 : el.parentElement) || null;
                 } while (el);
             }
             focusEl === null || focusEl === void 0 ? void 0 : focusEl.focus();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@primer/view-components",
-  "version": "0.1.9-rc.c91f6e8b",
+  "version": "0.1.9-rc.ca2fbe65",
   "description": "ViewComponents for the Primer Design System",
   "main": "app/assets/javascripts/primer_view_components.js",
   "module": "app/components/primer/primer.js",
@@ -55,7 +55,7 @@
     "@github/relative-time-element": "^4.0.0",
     "@github/tab-container-element": "^3.1.2",
     "@oddbird/popover-polyfill": "^0.1.1",
-    "@primer/behaviors": "^1.2.0"
+    "@primer/behaviors": "^1.3.4"
   },
   "devDependencies": {
     "@changesets/changelog-github": "^0.4.6",
@@ -65,7 +65,7 @@
     "@github/prettier-config": "0.0.4",
     "@playwright/test": "^1.27.1",
     "@primer/css": "21.0.1",
-    "@primer/primitives": "^7.11.7",
+    "@primer/primitives": "^7.11.10",
     "@rollup/plugin-node-resolve": "^13.3.0",
     "@rollup/plugin-typescript": "^8.3.3",
     "@typescript-eslint/eslint-plugin": "^5.31.0",
@@ -82,6 +82,7 @@
     "playwright": "^1.27.1",
     "postcss": "^8.4.16",
     "postcss-cli": "^10.0.0",
+    "postcss-custom-properties-fallback": "^1.0.2",
     "postcss-import": "^14.1.0",
     "postcss-mixins": "^9.0.3",
     "postcss-preset-env": "^7.8.0",

package/static/arguments.json

@@ -1692,7 +1692,13 @@
         "name": "subtitle",
         "type": "String",
         "default": "`nil`",
-        "description": "Provides dditional context for the Overlay, also setting the `aria-describedby` attribute."
+        "description": "Provides additional context for the Overlay, also setting the `aria-describedby` attribute."
+      },
+      {
+        "name": "overlay_id",
+        "type": "String",
+        "default": "`nil`",
+        "description": "Provides the id of the overlay element so the close button can close it"
       },
       {
         "name": "size",