@openproject/primer-view-components 0.27.0-rc.ed6bcf82 → 0.28.0-rc.6db1fc3c

package/app/components/primer/open_project/zen_mode_button.d.ts

@@ -0,0 +1,13 @@
+declare class ZenModeButtonElement extends HTMLElement {
+    button: HTMLElement;
+    inZenMode: boolean;
+    private deactivateZenMode;
+    private activateZenMode;
+    performAction(): void;
+}
+declare global {
+    interface Window {
+        ZenModeButtonElement: typeof ZenModeButtonElement;
+    }
+}
+export {};

package/app/components/primer/open_project/zen_mode_button.js

@@ -0,0 +1,45 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { controller, target } from '@github/catalyst';
+let ZenModeButtonElement = class ZenModeButtonElement extends HTMLElement {
+    constructor() {
+        super(...arguments);
+        this.inZenMode = false;
+    }
+    deactivateZenMode() {
+        this.inZenMode = false;
+        this.button.setAttribute('aria-pressed', 'false');
+        if (document.exitFullscreen) {
+            void document.exitFullscreen();
+        }
+    }
+    activateZenMode() {
+        this.inZenMode = true;
+        this.button.setAttribute('aria-pressed', 'true');
+        if (document.documentElement.requestFullscreen) {
+            void document.documentElement.requestFullscreen();
+        }
+    }
+    performAction() {
+        if (this.inZenMode) {
+            this.deactivateZenMode();
+        }
+        else {
+            this.activateZenMode();
+        }
+    }
+};
+__decorate([
+    target
+], ZenModeButtonElement.prototype, "button", void 0);
+ZenModeButtonElement = __decorate([
+    controller
+], ZenModeButtonElement);
+if (!window.customElements.get('zen-mode-button')) {
+    window.ZenModeButtonElement = ZenModeButtonElement;
+    window.customElements.define('zen-mode-button', ZenModeButtonElement);
+}

package/app/components/primer/primer.d.ts

@@ -23,3 +23,4 @@ import '../../../lib/primer/forms/primer_text_field';
 import '../../../lib/primer/forms/toggle_switch_input';
 import './alpha/action_menu/action_menu_element';
 import './open_project/page_header_element';
+import './open_project/zen_mode_button';

package/app/components/primer/primer.js

@@ -23,3 +23,4 @@ import '../../../lib/primer/forms/primer_text_field';
 import '../../../lib/primer/forms/toggle_switch_input';
 import './alpha/action_menu/action_menu_element';
 import './open_project/page_header_element';
+import './open_project/zen_mode_button';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@openproject/primer-view-components",
-  "version": "0.27.0-rc.ed6bcf82",
+  "version": "0.28.0-rc.6db1fc3c",
   "description": "ViewComponents of the Primer Design System for OpenProject",
   "main": "app/assets/javascripts/primer_view_components.js",
   "module": "app/components/primer/primer.js",

package/static/arguments.json

@@ -4974,12 +4974,34 @@
     ]
   },
   {
-    "component": "OpenProject::PageHeader::PageHeaderActionMenu",
+    "component": "OpenProject::PageHeader::Dialog",
     "status": "open_project",
     "a11y_reviewed": false,
-    "short_name": "OpenProjectPageHeaderPageHeaderActionMenu",
-    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/open_project/page_header/page_header_action_menu.rb",
-    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/open_project/page_header/page_header_action_menu/default/",
+    "short_name": "OpenProjectPageHeaderDialog",
+    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/open_project/page_header/dialog.rb",
+    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/open_project/page_header/dialog/default/",
+    "parameters": [
+      {
+        "name": "dialog_arguments",
+        "type": "Hash",
+        "default": "`{}`",
+        "description": "The arguments accepted by [Dialog](/components/alpha/dialog)."
+      },
+      {
+        "name": "button_arguments",
+        "type": "Hash",
+        "default": "`{}`",
+        "description": "The arguments accepted by [Button](/components/beta/button) or [IconButton](/components/beta/iconbutton), depending on the value of the `icon:` argument."
+      }
+    ]
+  },
+  {
+    "component": "OpenProject::PageHeader::Menu",
+    "status": "open_project",
+    "a11y_reviewed": false,
+    "short_name": "OpenProjectPageHeaderMenu",
+    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/open_project/page_header/menu.rb",
+    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/open_project/page_header/menu/default/",
     "parameters": [
       {
         "name": "menu_arguments",
@@ -4995,6 +5017,22 @@
       }
     ]
   },
+  {
+    "component": "OpenProject::ZenModeButton",
+    "status": "open_project",
+    "a11y_reviewed": false,
+    "short_name": "OpenProjectZenModeButton",
+    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/open_project/zen_mode_button.rb",
+    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/open_project/zen_mode_button/default/",
+    "parameters": [
+      {
+        "name": "system_arguments",
+        "type": "Hash",
+        "default": "N/A",
+        "description": "[System arguments](/system-arguments)"
+      }
+    ]
+  },
   {
     "component": "Tooltip",
     "status": "deprecated",

package/static/audited_at.json

@@ -121,7 +121,9 @@
   "Primer::OpenProject::GridLayout::Area": "",
   "Primer::OpenProject::InputGroup": "",
   "Primer::OpenProject::PageHeader": "",
-  "Primer::OpenProject::PageHeader::PageHeaderActionMenu": "",
+  "Primer::OpenProject::PageHeader::Dialog": "",
+  "Primer::OpenProject::PageHeader::Menu": "",
+  "Primer::OpenProject::ZenModeButton": "",
   "Primer::Tooltip": "",
   "Primer::Truncate": ""
 }

package/static/constants.json

@@ -1449,6 +1449,7 @@
       "block",
       "none"
     ],
+    "Dialog": "Primer::OpenProject::PageHeader::Dialog",
     "HEADER_VARIANT_OPTIONS": [
       "medium",
       "large"
@@ -1466,9 +1467,15 @@
       "flex",
       "none"
     ],
-    "PageHeaderActionMenu": "Primer::OpenProject::PageHeader::PageHeaderActionMenu"
+    "Menu": "Primer::OpenProject::PageHeader::Menu"
   },
-  "Primer::OpenProject::PageHeader::PageHeaderActionMenu": {
+  "Primer::OpenProject::PageHeader::Dialog": {
+  },
+  "Primer::OpenProject::PageHeader::Menu": {
+  },
+  "Primer::OpenProject::ZenModeButton": {
+    "ZEN_MODE_BUTTON_ICON": "screen-full",
+    "ZEN_MODE_BUTTON_LABEL": "Translation missing: en.label_zen_mode"
   },
   "Primer::Tooltip": {
     "ALIGN_DEFAULT": "default",

package/static/info_arch.json

@@ -16605,6 +16605,45 @@
           ]
         }
       },
+      {
+        "preview_path": "primer/open_project/page_header/menu_actions",
+        "name": "menu_actions",
+        "snapshot": "false",
+        "skip_rules": {
+          "wont_fix": [
+            "region"
+          ],
+          "will_fix": [
+            "color-contrast"
+          ]
+        }
+      },
+      {
+        "preview_path": "primer/open_project/page_header/dialog_actions",
+        "name": "dialog_actions",
+        "snapshot": "false",
+        "skip_rules": {
+          "wont_fix": [
+            "region"
+          ],
+          "will_fix": [
+            "color-contrast"
+          ]
+        }
+      },
+      {
+        "preview_path": "primer/open_project/page_header/zen_mode_button_actions",
+        "name": "zen_mode_button_actions",
+        "snapshot": "false",
+        "skip_rules": {
+          "wont_fix": [
+            "region"
+          ],
+          "will_fix": [
+            "color-contrast"
+          ]
+        }
+      },
       {
         "preview_path": "primer/open_project/page_header/leading_action",
         "name": "leading_action",
@@ -16637,18 +16676,58 @@
     ]
   },
   {
-    "fully_qualified_name": "Primer::OpenProject::PageHeader::PageHeaderActionMenu",
-    "description": "A Helper class to create ActionMenus inside the PageHeader action slot",
+    "fully_qualified_name": "Primer::OpenProject::PageHeader::Dialog",
+    "description": "A Helper class to create ActionMenus inside the PageHeader action slot\nDo not use standalone",
     "accessibility_docs": null,
     "is_form_component": false,
     "is_published": true,
     "requires_js": false,
-    "component": "OpenProject::PageHeader::PageHeaderActionMenu",
+    "component": "OpenProject::PageHeader::Dialog",
     "status": "open_project",
     "a11y_reviewed": false,
-    "short_name": "OpenProjectPageHeaderPageHeaderActionMenu",
-    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/open_project/page_header/page_header_action_menu.rb",
-    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/open_project/page_header/page_header_action_menu/default/",
+    "short_name": "OpenProjectPageHeaderDialog",
+    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/open_project/page_header/dialog.rb",
+    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/open_project/page_header/dialog/default/",
+    "parameters": [
+      {
+        "name": "dialog_arguments",
+        "type": "Hash",
+        "default": "`{}`",
+        "description": "The arguments accepted by {{#link_to_component}}Primer::Alpha::Dialog{{/link_to_component}}."
+      },
+      {
+        "name": "button_arguments",
+        "type": "Hash",
+        "default": "`{}`",
+        "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 value of the `icon:` argument."
+      }
+    ],
+    "slots": [
+
+    ],
+    "methods": [
+
+    ],
+    "previews": [
+
+    ],
+    "subcomponents": [
+
+    ]
+  },
+  {
+    "fully_qualified_name": "Primer::OpenProject::PageHeader::Menu",
+    "description": "A Helper class to create ActionMenus inside the PageHeader action slot\nIt should not be used standalone",
+    "accessibility_docs": null,
+    "is_form_component": false,
+    "is_published": true,
+    "requires_js": false,
+    "component": "OpenProject::PageHeader::Menu",
+    "status": "open_project",
+    "a11y_reviewed": false,
+    "short_name": "OpenProjectPageHeaderMenu",
+    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/open_project/page_header/menu.rb",
+    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/open_project/page_header/menu/default/",
     "parameters": [
       {
         "name": "menu_arguments",
@@ -16676,6 +16755,65 @@
 
     ]
   },
+  {
+    "fully_qualified_name": "Primer::OpenProject::ZenModeButton",
+    "description": "Add a general description of component here\nAdd additional usage considerations or best practices that may aid the user to use the component correctly.",
+    "accessibility_docs": "Add any accessibility considerations",
+    "is_form_component": false,
+    "is_published": true,
+    "requires_js": false,
+    "component": "OpenProject::ZenModeButton",
+    "status": "open_project",
+    "a11y_reviewed": false,
+    "short_name": "OpenProjectZenModeButton",
+    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/open_project/zen_mode_button.rb",
+    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/open_project/zen_mode_button/default/",
+    "parameters": [
+      {
+        "name": "system_arguments",
+        "type": "Hash",
+        "default": "N/A",
+        "description": "{{link_to_system_arguments_docs}}"
+      }
+    ],
+    "slots": [
+
+    ],
+    "methods": [
+
+    ],
+    "previews": [
+      {
+        "preview_path": "primer/open_project/zen_mode_button/default",
+        "name": "default",
+        "snapshot": "true",
+        "skip_rules": {
+          "wont_fix": [
+            "region"
+          ],
+          "will_fix": [
+            "color-contrast"
+          ]
+        }
+      },
+      {
+        "preview_path": "primer/open_project/zen_mode_button/playground",
+        "name": "playground",
+        "snapshot": "false",
+        "skip_rules": {
+          "wont_fix": [
+            "region"
+          ],
+          "will_fix": [
+            "color-contrast"
+          ]
+        }
+      }
+    ],
+    "subcomponents": [
+
+    ]
+  },
   {
     "fully_qualified_name": "Primer::Tooltip",
     "description": "`Tooltip` is a wrapper component that will apply a tooltip to the provided content.",

package/static/previews.json

@@ -5196,6 +5196,45 @@
           ]
         }
       },
+      {
+        "preview_path": "primer/open_project/page_header/menu_actions",
+        "name": "menu_actions",
+        "snapshot": "false",
+        "skip_rules": {
+          "wont_fix": [
+            "region"
+          ],
+          "will_fix": [
+            "color-contrast"
+          ]
+        }
+      },
+      {
+        "preview_path": "primer/open_project/page_header/dialog_actions",
+        "name": "dialog_actions",
+        "snapshot": "false",
+        "skip_rules": {
+          "wont_fix": [
+            "region"
+          ],
+          "will_fix": [
+            "color-contrast"
+          ]
+        }
+      },
+      {
+        "preview_path": "primer/open_project/page_header/zen_mode_button_actions",
+        "name": "zen_mode_button_actions",
+        "snapshot": "false",
+        "skip_rules": {
+          "wont_fix": [
+            "region"
+          ],
+          "will_fix": [
+            "color-contrast"
+          ]
+        }
+      },
       {
         "preview_path": "primer/open_project/page_header/leading_action",
         "name": "leading_action",
@@ -7456,5 +7495,39 @@
         }
       }
     ]
+  },
+  {
+    "name": "zen_mode_button",
+    "component": "OpenProject::ZenModeButton",
+    "status": "open_project",
+    "lookup_path": "primer/open_project/zen_mode_button",
+    "examples": [
+      {
+        "preview_path": "primer/open_project/zen_mode_button/default",
+        "name": "default",
+        "snapshot": "true",
+        "skip_rules": {
+          "wont_fix": [
+            "region"
+          ],
+          "will_fix": [
+            "color-contrast"
+          ]
+        }
+      },
+      {
+        "preview_path": "primer/open_project/zen_mode_button/playground",
+        "name": "playground",
+        "snapshot": "false",
+        "skip_rules": {
+          "wont_fix": [
+            "region"
+          ],
+          "will_fix": [
+            "color-contrast"
+          ]
+        }
+      }
+    ]
   }
 ]

package/static/statuses.json

@@ -121,7 +121,9 @@
   "Primer::OpenProject::GridLayout::Area": "open_project",
   "Primer::OpenProject::InputGroup": "open_project",
   "Primer::OpenProject::PageHeader": "open_project",
-  "Primer::OpenProject::PageHeader::PageHeaderActionMenu": "open_project",
+  "Primer::OpenProject::PageHeader::Dialog": "open_project",
+  "Primer::OpenProject::PageHeader::Menu": "open_project",
+  "Primer::OpenProject::ZenModeButton": "open_project",
   "Primer::Tooltip": "deprecated",
   "Primer::Truncate": "deprecated"
 }