orcs-design-system 2.0.84 → 2.0.85

package/es/components/Header/index.js

@@ -269,16 +269,32 @@ var ExternalAppSwitcher = styled("div").withConfig({
     }
   });
 });
+var Theme = styled("div").withConfig({
+  displayName: "Header__Theme",
+  componentId: "yf04b-9"
+})(function (props) {
+  return css({
+    borderTop: "solid 1px rgba(255,255,255,0.3)",
+    padding: "r",
+    paddingTop: "s",
+    marginTop: "s",
+    "[class^='Small'], [class*=' Small']": {
+      display: "block",
+      fontWeight: themeGet("fontWeights.1")(props),
+      marginTop: "xs"
+    }
+  });
+});
 var RightAligned = styled("div").withConfig({
   displayName: "Header__RightAligned",
-  componentId: "yf04b-9"
+  componentId: "yf04b-10"
 })(css({
   marginLeft: "auto",
   marginRight: "r"
 }));
 var Overlay = styled("label").withConfig({
   displayName: "Header__Overlay",
-  componentId: "yf04b-10"
+  componentId: "yf04b-11"
 })(function (props) {
   return css({
     position: "fixed",
@@ -312,7 +328,8 @@ export default function Header(_ref) {
       searchComponent = _ref.searchComponent,
       dataTestId = _ref.dataTestId,
       theme = _ref.theme,
-      variant = _ref.variant;
+      variant = _ref.variant,
+      themeSwitcherContent = _ref.themeSwitcherContent;
   var component = /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(MobileNavToggle, {
     type: "checkbox",
     id: "mobileMenuToggle"
@@ -379,7 +396,12 @@ export default function Header(_ref) {
     px: "r",
     py: "s",
     display: "block"
-  }, "External apps:"), externalAppSwitcherContent))), /*#__PURE__*/React.createElement(Overlay, {
+  }, "External apps:"), externalAppSwitcherContent), themeSwitcherContent && /*#__PURE__*/React.createElement(Theme, null, /*#__PURE__*/React.createElement(Small, {
+    color: "white60",
+    pt: "s",
+    pb: "r",
+    display: "block"
+  }, "Switch theme:"), themeSwitcherContent))), /*#__PURE__*/React.createElement(Overlay, {
     htmlFor: "mobileMenuToggle"
   }));
   return theme ? /*#__PURE__*/React.createElement(ThemeProvider, {
@@ -430,7 +452,10 @@ Header.propTypes = {
   variant: PropTypes.oneOf(["search"]),
 
   /** Allows for use of the `data-testid` attribute for testing. */
-  dataTestId: PropTypes.string
+  dataTestId: PropTypes.string,
+
+  /** Theme related props **/
+  themeSwitcherContent: PropTypes.oneOfType([PropTypes.node, PropTypes.arrayOf(PropTypes.node)])
 };
 Header.__docgenInfo = {
   "description": "Header component for global app navigation.\n\nAt screen sizes less than 1100px the links are instead moved into a mobile menu toggled by a burger icon button to play nice with smaller devices.",
@@ -585,6 +610,21 @@ Header.__docgenInfo = {
       },
       "required": false,
       "description": "Allows for use of the `data-testid` attribute for testing."
+    },
+    "themeSwitcherContent": {
+      "type": {
+        "name": "union",
+        "value": [{
+          "name": "node"
+        }, {
+          "name": "arrayOf",
+          "value": {
+            "name": "node"
+          }
+        }]
+      },
+      "required": false,
+      "description": "Theme related props *"
     }
   }
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "orcs-design-system",
-  "version": "2.0.84",
+  "version": "2.0.85",
   "description": "Orchestrated's Design System, aka: ORCS",
   "keywords": [
     "design",