@openproject/primer-view-components 0.12.0-rc.3e62fe89 → 0.12.0-rc.a2f270db

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@openproject/primer-view-components",
-  "version": "0.12.0-rc.3e62fe89",
+  "version": "0.12.0-rc.a2f270db",
   "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

@@ -4653,6 +4653,84 @@
       }
     ]
   },
+  {
+    "component": "OpenProject::FlexLayout",
+    "status": "open_project",
+    "a11y_reviewed": false,
+    "short_name": "OpenProjectFlexLayout",
+    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/open_project/flex_layout.rb",
+    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/open_project/flex_layout/default/",
+    "parameters": [
+      {
+        "name": "system_arguments",
+        "type": "Hash",
+        "default": "N/A",
+        "description": "[System arguments](/system-arguments)"
+      }
+    ]
+  },
+  {
+    "component": "OpenProject::GridLayout",
+    "status": "open_project",
+    "a11y_reviewed": false,
+    "short_name": "OpenProjectGridLayout",
+    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/open_project/grid_layout.rb",
+    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/open_project/grid_layout/default/",
+    "parameters": [
+      {
+        "name": "css_class",
+        "type": "String",
+        "default": "N/A",
+        "description": "The basic css class applied on the grid-container"
+      },
+      {
+        "name": "system_arguments",
+        "type": "Hash",
+        "default": "N/A",
+        "description": "[System arguments](/system-arguments)"
+      }
+    ]
+  },
+  {
+    "component": "OpenProject::GridLayout::Area",
+    "status": "open_project",
+    "a11y_reviewed": false,
+    "short_name": "OpenProjectGridLayoutArea",
+    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/open_project/grid_layout/area.rb",
+    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/open_project/grid_layout/area/default/",
+    "parameters": [
+      {
+        "name": "css_class",
+        "type": "String",
+        "default": "N/A",
+        "description": "The basic css class applied on the grid-container"
+      },
+      {
+        "name": "area_name",
+        "type": "Symbol",
+        "default": "N/A",
+        "description": "The specific area name, used for creating the element class and the \"grid-area\" style"
+      },
+      {
+        "name": "component",
+        "type": "ViewComponent::Base",
+        "default": "`Primer::BaseComponent`",
+        "description": "The instance of the component to be rendered."
+      },
+      {
+        "name": "tag",
+        "type": "Symbol",
+        "default": "`:div`",
+        "description": "One of `:div` or `:span`."
+      },
+      {
+        "name": "system_arguments",
+        "type": "Hash",
+        "default": "N/A",
+        "description": "[System arguments](/system-arguments)"
+      }
+    ]
+  },
   {
     "component": "OpenProject::PageHeader",
     "status": "open_project",

package/static/audited_at.json

@@ -110,6 +110,9 @@
   "Primer::OpenProject::BorderGrid": "",
   "Primer::OpenProject::BorderGrid::Cell": "",
   "Primer::OpenProject::DragHandle": "",
+  "Primer::OpenProject::FlexLayout": "",
+  "Primer::OpenProject::GridLayout": "",
+  "Primer::OpenProject::GridLayout::Area": "",
   "Primer::OpenProject::PageHeader": "",
   "Primer::Tooltip": "",
   "Primer::Truncate": ""

package/static/constants.json

@@ -1336,6 +1336,18 @@
       "medium"
     ]
   },
+  "Primer::OpenProject::FlexLayout": {
+  },
+  "Primer::OpenProject::GridLayout": {
+    "Area": "Primer::OpenProject::GridLayout::Area"
+  },
+  "Primer::OpenProject::GridLayout::Area": {
+    "DEFAULT_TAG": "div",
+    "TAG_OPTIONS": [
+      "div",
+      "span"
+    ]
+  },
   "Primer::OpenProject::PageHeader": {
     "DEFAULT_HEADER_VARIANT": "medium",
     "HEADER_VARIANT_OPTIONS": [

package/static/info_arch.json

@@ -15036,6 +15036,259 @@
 
     ]
   },
+  {
+    "fully_qualified_name": "Primer::OpenProject::FlexLayout",
+    "description": "A layouting component used to arrange multiple components next / below each other",
+    "accessibility_docs": null,
+    "is_form_component": false,
+    "is_published": true,
+    "requires_js": false,
+    "component": "OpenProject::FlexLayout",
+    "status": "open_project",
+    "a11y_reviewed": false,
+    "short_name": "OpenProjectFlexLayout",
+    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/open_project/flex_layout.rb",
+    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/open_project/flex_layout/default/",
+    "parameters": [
+      {
+        "name": "system_arguments",
+        "type": "Hash",
+        "default": "N/A",
+        "description": "{{link_to_system_arguments_docs}}"
+      }
+    ],
+    "slots": [
+      {
+        "name": "rows",
+        "description": null,
+        "parameters": [
+
+        ]
+      },
+      {
+        "name": "columns",
+        "description": null,
+        "parameters": [
+
+        ]
+      },
+      {
+        "name": "boxes",
+        "description": "boxes are used when direction is set to row or column based on responsive breakpoints",
+        "parameters": [
+
+        ]
+      }
+    ],
+    "methods": [
+
+    ],
+    "previews": [
+      {
+        "preview_path": "primer/open_project/flex_layout/playground",
+        "name": "playground",
+        "snapshot": "false",
+        "skip_rules": {
+          "wont_fix": [
+            "region"
+          ],
+          "will_fix": [
+            "color-contrast"
+          ]
+        }
+      },
+      {
+        "preview_path": "primer/open_project/flex_layout/default",
+        "name": "default",
+        "snapshot": "false",
+        "skip_rules": {
+          "wont_fix": [
+            "region"
+          ],
+          "will_fix": [
+            "color-contrast"
+          ]
+        }
+      },
+      {
+        "preview_path": "primer/open_project/flex_layout/row_layout",
+        "name": "row_layout",
+        "snapshot": "false",
+        "skip_rules": {
+          "wont_fix": [
+            "region"
+          ],
+          "will_fix": [
+            "color-contrast"
+          ]
+        }
+      },
+      {
+        "preview_path": "primer/open_project/flex_layout/column_layout",
+        "name": "column_layout",
+        "snapshot": "false",
+        "skip_rules": {
+          "wont_fix": [
+            "region"
+          ],
+          "will_fix": [
+            "color-contrast"
+          ]
+        }
+      },
+      {
+        "preview_path": "primer/open_project/flex_layout/nested_layout",
+        "name": "nested_layout",
+        "snapshot": "false",
+        "skip_rules": {
+          "wont_fix": [
+            "region"
+          ],
+          "will_fix": [
+            "color-contrast"
+          ]
+        }
+      }
+    ],
+    "subcomponents": [
+
+    ]
+  },
+  {
+    "fully_qualified_name": "Primer::OpenProject::GridLayout",
+    "description": "A layouting component used to arrange multiple components in a CSS Grid\nNote that this component only provides helpers (as the class names and grid-area styles).\nHowever, it does not define the actual Grid which should be done in a separate CSS-file.",
+    "accessibility_docs": null,
+    "is_form_component": false,
+    "is_published": true,
+    "requires_js": false,
+    "component": "OpenProject::GridLayout",
+    "status": "open_project",
+    "a11y_reviewed": false,
+    "short_name": "OpenProjectGridLayout",
+    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/open_project/grid_layout.rb",
+    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/open_project/grid_layout/default/",
+    "parameters": [
+      {
+        "name": "css_class",
+        "type": "String",
+        "default": "N/A",
+        "description": "The basic css class applied on the grid-container"
+      },
+      {
+        "name": "system_arguments",
+        "type": "Hash",
+        "default": "N/A",
+        "description": "{{link_to_system_arguments_docs}}"
+      }
+    ],
+    "slots": [
+      {
+        "name": "areas",
+        "description": null,
+        "parameters": [
+
+        ]
+      }
+    ],
+    "methods": [
+      {
+        "name": "css_class",
+        "description": "Returns the value of attribute css_class.",
+        "parameters": [
+
+        ]
+      }
+    ],
+    "previews": [
+      {
+        "preview_path": "primer/open_project/grid_layout/playground",
+        "name": "playground",
+        "snapshot": "false",
+        "skip_rules": {
+          "wont_fix": [
+            "region"
+          ],
+          "will_fix": [
+            "color-contrast"
+          ]
+        }
+      },
+      {
+        "preview_path": "primer/open_project/grid_layout/default",
+        "name": "default",
+        "snapshot": "false",
+        "skip_rules": {
+          "wont_fix": [
+            "region"
+          ],
+          "will_fix": [
+            "color-contrast"
+          ]
+        }
+      }
+    ],
+    "subcomponents": [
+
+    ]
+  },
+  {
+    "fully_qualified_name": "Primer::OpenProject::GridLayout::Area",
+    "description": "GridLayout::Area is an internal component that wraps the items in a div with the given new class and responding \"grid-area\"",
+    "accessibility_docs": null,
+    "is_form_component": false,
+    "is_published": true,
+    "requires_js": false,
+    "component": "OpenProject::GridLayout::Area",
+    "status": "open_project",
+    "a11y_reviewed": false,
+    "short_name": "OpenProjectGridLayoutArea",
+    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/open_project/grid_layout/area.rb",
+    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/open_project/grid_layout/area/default/",
+    "parameters": [
+      {
+        "name": "css_class",
+        "type": "String",
+        "default": "N/A",
+        "description": "The basic css class applied on the grid-container"
+      },
+      {
+        "name": "area_name",
+        "type": "Symbol",
+        "default": "N/A",
+        "description": "The specific area name, used for creating the element class and the \"grid-area\" style"
+      },
+      {
+        "name": "component",
+        "type": "ViewComponent::Base",
+        "default": "`Primer::BaseComponent`",
+        "description": "The instance of the component to be rendered."
+      },
+      {
+        "name": "tag",
+        "type": "Symbol",
+        "default": "`:div`",
+        "description": "One of `:div` or `:span`."
+      },
+      {
+        "name": "system_arguments",
+        "type": "Hash",
+        "default": "N/A",
+        "description": "{{link_to_system_arguments_docs}}"
+      }
+    ],
+    "slots": [
+
+    ],
+    "methods": [
+
+    ],
+    "previews": [
+
+    ],
+    "subcomponents": [
+
+    ]
+  },
   {
     "fully_qualified_name": "Primer::OpenProject::PageHeader",
     "description": "A ViewComponent PageHeader inspired by the primer react variant",

package/static/previews.json

@@ -3335,6 +3335,79 @@
       }
     ]
   },
+  {
+    "name": "flex_layout",
+    "component": "OpenProject::FlexLayout",
+    "status": "open_project",
+    "lookup_path": "primer/open_project/flex_layout",
+    "examples": [
+      {
+        "preview_path": "primer/open_project/flex_layout/playground",
+        "name": "playground",
+        "snapshot": "false",
+        "skip_rules": {
+          "wont_fix": [
+            "region"
+          ],
+          "will_fix": [
+            "color-contrast"
+          ]
+        }
+      },
+      {
+        "preview_path": "primer/open_project/flex_layout/default",
+        "name": "default",
+        "snapshot": "false",
+        "skip_rules": {
+          "wont_fix": [
+            "region"
+          ],
+          "will_fix": [
+            "color-contrast"
+          ]
+        }
+      },
+      {
+        "preview_path": "primer/open_project/flex_layout/row_layout",
+        "name": "row_layout",
+        "snapshot": "false",
+        "skip_rules": {
+          "wont_fix": [
+            "region"
+          ],
+          "will_fix": [
+            "color-contrast"
+          ]
+        }
+      },
+      {
+        "preview_path": "primer/open_project/flex_layout/column_layout",
+        "name": "column_layout",
+        "snapshot": "false",
+        "skip_rules": {
+          "wont_fix": [
+            "region"
+          ],
+          "will_fix": [
+            "color-contrast"
+          ]
+        }
+      },
+      {
+        "preview_path": "primer/open_project/flex_layout/nested_layout",
+        "name": "nested_layout",
+        "snapshot": "false",
+        "skip_rules": {
+          "wont_fix": [
+            "region"
+          ],
+          "will_fix": [
+            "color-contrast"
+          ]
+        }
+      }
+    ]
+  },
   {
     "name": "form_control",
     "component": "FormControl",
@@ -3421,6 +3494,40 @@
       }
     ]
   },
+  {
+    "name": "grid_layout",
+    "component": "OpenProject::GridLayout",
+    "status": "open_project",
+    "lookup_path": "primer/open_project/grid_layout",
+    "examples": [
+      {
+        "preview_path": "primer/open_project/grid_layout/playground",
+        "name": "playground",
+        "snapshot": "false",
+        "skip_rules": {
+          "wont_fix": [
+            "region"
+          ],
+          "will_fix": [
+            "color-contrast"
+          ]
+        }
+      },
+      {
+        "preview_path": "primer/open_project/grid_layout/default",
+        "name": "default",
+        "snapshot": "false",
+        "skip_rules": {
+          "wont_fix": [
+            "region"
+          ],
+          "will_fix": [
+            "color-contrast"
+          ]
+        }
+      }
+    ]
+  },
   {
     "name": "heading",
     "component": "Heading",

package/static/statuses.json

@@ -110,6 +110,9 @@
   "Primer::OpenProject::BorderGrid": "open_project",
   "Primer::OpenProject::BorderGrid::Cell": "open_project",
   "Primer::OpenProject::DragHandle": "open_project",
+  "Primer::OpenProject::FlexLayout": "open_project",
+  "Primer::OpenProject::GridLayout": "open_project",
+  "Primer::OpenProject::GridLayout::Area": "open_project",
   "Primer::OpenProject::PageHeader": "open_project",
   "Primer::Tooltip": "deprecated",
   "Primer::Truncate": "deprecated"