blue-react 7.9.1 → 8.0.0-next.4

package/README.md

@@ -6,11 +6,29 @@
 
 [![npm version](https://img.shields.io/npm/v/blue-react)](https://www.npmjs.com/package/blue-react)
 
-[Checkout the docs](https://bruegmann.github.io/blue-react) to find out how to use Blue React.
+[Checkout the docs](https://bruegmann.github.io/blue-react) to find out how to
+use Blue React.
+
+## Breaking changes between v7 and v8
+
+- Removed deprecated components:
+  - Actions (Alternative: ActionMenu)
+  - ActionMenuItem (Alternative: MenuItem)
+  - FluentBtn (Alternative: button, bzw. a)
+  - HeaderActions
+  - DropdownMenuItem (Alternative: MenuItem)
+  - Stylesheets
+- Renamed all `.blue-app-*` to `.blue-*`
+- Renamed `Grid` to `Layout`
+  - `.blue-grid` ➡ `.blue-layout`
+  - `Grid.tsx` ➡ `Layout.tsx`
+  - Global `window.blueGridRef` ➡ `window.blueLayoutRef`
+- Renamed all `.blue-sidebar-*` to `.blue-menu-item-*`
 
 ## Developing
 
-This project is built with [CRA](https://create-react-app.dev/). To start developing, just and install everything with `npm i` and run:
+This project is built with [CRA](https://create-react-app.dev/). To start
+developing, just and install everything with `npm i` and run:
 
 ```
 npm start
@@ -25,7 +43,8 @@ By running
 npm publish
 ```
 
-the missing files in `./dist` will be created, the docs will be generated and the NPM package will be released.
+the missing files in `./dist` will be created, the docs will be generated and
+the NPM package will be released.
 
 To publish changes on the documentary, run:
 

package/dist/components/ActionMenu.js

@@ -55,18 +55,18 @@ function ActionMenu(props) {
   };
 
   var initToggleStatus = function initToggleStatus() {
-    setActionsToggledIn(_Utilities.default.hasClass(document.querySelector(".blue-app-actions"), "open"));
+    setActionsToggledIn(_Utilities.default.hasClass(document.querySelector(".blue-actions"), "open"));
   };
 
   (0, _react.useEffect)(function () {
     initToggleStatus();
-    var appWrapper = document.querySelector(".blue-app-wrapper");
+    var appWrapper = document.querySelector(".blue-wrapper");
 
     if (appWrapper) {
       appWrapper.onclick = toggleActions;
     }
 
-    document.querySelectorAll(".blue-app-actions-menu .nav-link").forEach(function (link) {
+    document.querySelectorAll(".blue-actions-menu .nav-link").forEach(function (link) {
       link.addEventListener("click", function () {
         if (actionsToggledIn) {
           toggleActions();
@@ -75,16 +75,14 @@ function ActionMenu(props) {
     });
   }, []);
   return /*#__PURE__*/_react.default.createElement("div", {
-    className: "blue-app-actions navbar ".concat(className, " navbar-expand").concat(_break !== "none" ? "-".concat(_break) : "", " ").concat(_break)
+    className: "blue-actions navbar ".concat(className, " navbar-expand").concat(_break !== "none" ? "-".concat(_break) : "", " ").concat(_break)
   }, /*#__PURE__*/_react.default.createElement("div", {
-    className: "ui-header-wrapper",
+    className: "blue-header-wrapper",
     onClick: _Utilities.default.scrollToTop
   }), /*#__PURE__*/_react.default.createElement("ul", {
-    className: "blue-app-actions-menu nav navbar-nav navbar-right fluent-btn"
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: "fluent-btn-ball"
-  }), !actionsToggledIn && !hideToggleAction ? /*#__PURE__*/_react.default.createElement(_MenuItem.default, {
-    className: "blue-app-actions-menu-toggle",
+    className: "blue-actions-menu nav navbar-nav navbar-right"
+  }, !actionsToggledIn && !hideToggleAction ? /*#__PURE__*/_react.default.createElement(_MenuItem.default, {
+    className: "blue-actions-menu-toggle",
     onClick: function onClick() {
       return toggleActions();
     },

package/dist/components/ActionMenuSwitch.js

@@ -21,13 +21,13 @@ function ActionMenuSwitch(props) {
     className: "nav-item"
   }, /*#__PURE__*/_react.default.createElement("a", {
     href: "javascript:void(0)",
-    className: "nav-link blue-app-actions-menu-item",
+    className: "nav-link blue-actions-menu-item",
     onClick: function onClick() {
       if (props.onChange) props.onChange();
     }
   }, /*#__PURE__*/_react.default.createElement(_Switch.default, _extends({}, props, {
     elementType: "span"
   })), props.label && /*#__PURE__*/_react.default.createElement("span", {
-    className: "blue-app-actions-label"
+    className: "blue-actions-label"
   }, "\xA0", props.label)));
 }

package/dist/components/Body.js

@@ -27,7 +27,7 @@ function Body(_ref) {
       children = _ref.children,
       rest = _objectWithoutProperties(_ref, _excluded);
 
-  var pageBodyClassName = "blue-app-page";
+  var pageBodyClassName = "blue-page";
   return /*#__PURE__*/_react.default.createElement("div", {
     id: id,
     className: className ? pageBodyClassName + " " + className : pageBodyClassName + (hasActions ? " has-actions" : "") + " break-".concat(rest.break || "md"),