@pingux/astro 2.72.0-alpha.0 → 2.72.0

package/lib/cjs/components/EnvironmentBreadcrumb/EnvironmentBreadcrumb.js

@@ -268,7 +268,6 @@ var EnvironmentBreadcrumb = /*#__PURE__*/(0, _react.forwardRef)(function (props,
     onClose: handlePopoverClose,
     hasNoArrow: true,
     isDismissable: true,
-    p: 10,
     role: "presentation"
   }), (0, _react2.jsx)(_reactAria.FocusScope, {
     restoreFocus: true,
@@ -280,7 +279,8 @@ var EnvironmentBreadcrumb = /*#__PURE__*/(0, _react.forwardRef)(function (props,
     placeholder: "Search",
     "aria-label": "Items Search",
     "data-testid": "Environment-Breadcrumb-Search",
-    onChange: setSearchValue
+    onChange: setSearchValue,
+    p: "10px"
   }, searchProps)), (0, _react2.jsx)(_visuallyHidden.VisuallyHidden, {
     role: "alert",
     "aria-live": "polite",

package/lib/cjs/components/EnvironmentBreadcrumb/EnvironmentBreadcrumb.stories.d.ts

@@ -4,9 +4,7 @@ import { EnvironmentBreadcrumbProps, EnvironmentItemProps } from '../../types';
 declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0a347bb9").R, import("@storybook/types").Args>;
 export default _default;
 export declare const Default: StoryFn<EnvironmentBreadcrumbProps<EnvironmentItemProps>>;
-export declare const DefaultClosed: (args: EnvironmentBreadcrumbProps<EnvironmentItemProps>) => React.JSX.Element;
 export declare const WithSections: () => React.JSX.Element;
 export declare const OrgLevel: () => React.JSX.Element;
 export declare const DefaultOpen: () => React.JSX.Element;
 export declare const ControlledMenu: () => React.JSX.Element;
-export declare const RightAlignedBadges: (args: EnvironmentBreadcrumbProps<EnvironmentItemProps>) => React.JSX.Element;

package/lib/cjs/components/EnvironmentBreadcrumb/EnvironmentBreadcrumb.stories.js

@@ -14,7 +14,7 @@ var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequ
 _Object$defineProperty(exports, "__esModule", {
   value: true
 });
-exports["default"] = exports.WithSections = exports.RightAlignedBadges = exports.OrgLevel = exports.DefaultOpen = exports.DefaultClosed = exports.Default = exports.ControlledMenu = void 0;
+exports["default"] = exports.WithSections = exports.OrgLevel = exports.DefaultOpen = exports.Default = exports.ControlledMenu = void 0;
 var _find = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/find"));
 var _concat = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/concat"));
 var _reduce = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/reduce"));
@@ -112,17 +112,6 @@ var environmentsWithSections = [{
   }, {
     name: 'Mine'
   }]
-}, {
-  name: 'Other',
-  key: 'Other',
-  options: [{
-    name: 'Default'
-  }, {
-    name: 'Auth test',
-    isSandbox: true
-  }, {
-    name: 'Mike’s Workforce'
-  }]
 }];
 var Default = function Default(args) {
   var _useState = (0, _react.useState)(defaultEnvironments[0]),
@@ -151,7 +140,7 @@ var Default = function Default(args) {
   };
   return (0, _react2.jsx)(_index.EnvironmentBreadcrumb, (0, _extends2["default"])({}, args, {
     items: defaultEnvironments,
-    name: "Globochem",
+    name: "Organization",
     selectedItem: envNode,
     onSelectionChange: handleSelectionChange
   }), function (_ref2) {
@@ -163,71 +152,28 @@ var Default = function Default(args) {
     }, name, isSandbox ? (0, _react2.jsx)(_index.Badge, {
       label: "SANDBOX",
       variant: "environmentBadge",
-      bg: "neutral.40"
+      bg: "neutral.40",
+      align: "right"
     }) : null);
   });
 };
 exports.Default = Default;
-var DefaultClosed = function DefaultClosed(args) {
-  var _useState3 = (0, _react.useState)(defaultEnvironments[0]),
-    _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
-    selectedEnvironment = _useState4[0],
-    setSelectedEnvironment = _useState4[1];
-  var envNode = (0, _react2.jsx)(_index.Box, {
-    isRow: true,
-    key: selectedEnvironment.name
-  }, (0, _react2.jsx)(_index.Text, {
-    color: "inherit"
-  }, selectedEnvironment.name), selectedEnvironment.isSandbox ? (0, _react2.jsx)(_index.Badge, {
-    label: "SANDBOX",
-    variant: "environmentBadge",
-    bg: "neutral.40"
-  }) : null);
-  var findEnvObj = function findEnvObj(envName) {
-    return (0, _find["default"])(defaultEnvironments).call(defaultEnvironments, function (_ref3) {
-      var name = _ref3.name;
-      return name === envName;
-    });
-  };
-  var handleSelectionChange = function handleSelectionChange(newEnvName) {
-    var envObj = findEnvObj(newEnvName);
-    if ((0, _typeof2["default"])(envObj) === 'object') setSelectedEnvironment(_objectSpread({}, envObj));
-  };
-  return (0, _react2.jsx)(_index.EnvironmentBreadcrumb, (0, _extends2["default"])({}, args, {
-    items: defaultEnvironments,
-    name: "Globochem",
-    selectedItem: envNode,
-    onSelectionChange: handleSelectionChange
-  }), function (_ref4) {
-    var name = _ref4.name,
-      isSandbox = _ref4.isSandbox;
-    return (0, _react2.jsx)(_index.Item, {
-      key: name,
-      textValue: name
-    }, name, isSandbox ? (0, _react2.jsx)(_index.Badge, {
-      label: "SANDBOX",
-      variant: "environmentBadge",
-      bg: "neutral.40"
-    }) : null);
-  });
-};
-exports.DefaultClosed = DefaultClosed;
 var WithSections = function WithSections() {
   var _context, _context2;
   var selectedSectionIndex = 0;
   var selectedOptionIndex = 0;
-  var _useState5 = (0, _react.useState)(environmentsWithSections),
+  var _useState3 = (0, _react.useState)(environmentsWithSections),
+    _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
+    environments = _useState4[0],
+    setEnvironments = _useState4[1];
+  var _useState5 = (0, _react.useState)(null),
     _useState6 = (0, _slicedToArray2["default"])(_useState5, 2),
-    environments = _useState6[0],
-    setEnvironments = _useState6[1];
-  var _useState7 = (0, _react.useState)(null),
+    filteredOptionsNumber = _useState6[0],
+    setFilteredOptionsNumber = _useState6[1];
+  var _useState7 = (0, _react.useState)(environmentsWithSections[selectedSectionIndex].options && environmentsWithSections[selectedSectionIndex].options[selectedOptionIndex]),
     _useState8 = (0, _slicedToArray2["default"])(_useState7, 2),
-    filteredOptionsNumber = _useState8[0],
-    setFilteredOptionsNumber = _useState8[1];
-  var _useState9 = (0, _react.useState)(environmentsWithSections[selectedSectionIndex].options && environmentsWithSections[selectedSectionIndex].options[selectedOptionIndex]),
-    _useState10 = (0, _slicedToArray2["default"])(_useState9, 2),
-    selectedEnvironment = _useState10[0],
-    setSelectedEnvironment = _useState10[1];
+    selectedEnvironment = _useState8[0],
+    setSelectedEnvironment = _useState8[1];
   var selectedKey = (0, _concat["default"])(_context = "".concat(environmentsWithSections[selectedSectionIndex].key, "-")).call(_context, selectedEnvironment === null || selectedEnvironment === void 0 ? void 0 : selectedEnvironment.name);
   var recentEnvShown = 3;
   var totalOptionsNumber = (0, _reduce["default"])(environmentsWithSections).call(environmentsWithSections, function (acc, section) {
@@ -296,25 +242,25 @@ var WithSections = function WithSections() {
   }) : null);
   return (0, _react2.jsx)(_index.EnvironmentBreadcrumb, {
     items: environments,
-    name: "Globochem",
+    name: "Organization",
     selectedItem: envNode,
     onSelectionChange: handleEnvPress,
     onFilteredOptionsNumber: setFilteredOptionsNumber,
     optionsCountMessage: optionsCountMessage,
     isDefaultOpen: true
-  }, function (_ref5) {
-    var sectionName = _ref5.name,
-      sectionOptions = _ref5.options,
-      sectionKey = _ref5.key;
+  }, function (_ref3) {
+    var sectionName = _ref3.name,
+      sectionOptions = _ref3.options,
+      sectionKey = _ref3.key;
     return (0, _react2.jsx)(_index.Section, {
       key: sectionKey,
       title: sectionName,
       items: sectionOptions
-    }, function (_ref6) {
+    }, function (_ref4) {
       var _context7;
-      var itemName = _ref6.name,
-        itemOptions = _ref6.options,
-        isSandbox = _ref6.isSandbox;
+      var itemName = _ref4.name,
+        itemOptions = _ref4.options,
+        isSandbox = _ref4.isSandbox;
       return (0, _react2.jsx)(_index.Item, {
         key: (0, _concat["default"])(_context7 = "".concat(sectionName, "-")).call(_context7, itemName),
         childItems: itemOptions,
@@ -324,7 +270,8 @@ var WithSections = function WithSections() {
       }, itemName, isSandbox ? (0, _react2.jsx)(_index.Badge, {
         label: "SANDBOX",
         variant: "environmentBadge",
-        bg: "neutral.40"
+        bg: "neutral.40",
+        align: "right"
       }) : null));
     });
   });
@@ -332,15 +279,15 @@ var WithSections = function WithSections() {
 exports.WithSections = WithSections;
 var OrgLevel = function OrgLevel() {
   return (0, _react2.jsx)(_index.EnvironmentBreadcrumb, {
-    name: "Globochem"
+    name: "Organization"
   });
 };
 exports.OrgLevel = OrgLevel;
 var DefaultOpen = function DefaultOpen() {
-  var _useState11 = (0, _react.useState)(defaultEnvironments[0]),
-    _useState12 = (0, _slicedToArray2["default"])(_useState11, 2),
-    selectedEnvironment = _useState12[0],
-    setSelectedEnvironment = _useState12[1];
+  var _useState9 = (0, _react.useState)(defaultEnvironments[0]),
+    _useState10 = (0, _slicedToArray2["default"])(_useState9, 2),
+    selectedEnvironment = _useState10[0],
+    setSelectedEnvironment = _useState10[1];
   var envNode = (0, _react2.jsx)(_index.Box, {
     isRow: true,
     key: selectedEnvironment.name
@@ -352,8 +299,8 @@ var DefaultOpen = function DefaultOpen() {
     bg: "neutral.40"
   }) : null);
   var findEnvObj = function findEnvObj(envName) {
-    return (0, _find["default"])(defaultEnvironments).call(defaultEnvironments, function (_ref7) {
-      var name = _ref7.name;
+    return (0, _find["default"])(defaultEnvironments).call(defaultEnvironments, function (_ref5) {
+      var name = _ref5.name;
       return name === envName;
     });
   };
@@ -363,33 +310,34 @@ var DefaultOpen = function DefaultOpen() {
   };
   return (0, _react2.jsx)(_index.EnvironmentBreadcrumb, {
     items: defaultEnvironments,
-    name: "Globochem",
+    name: "Organization",
     selectedItem: envNode,
     onSelectionChange: handleSelectionChange,
     isDefaultOpen: true
-  }, function (_ref8) {
-    var name = _ref8.name,
-      isSandbox = _ref8.isSandbox;
+  }, function (_ref6) {
+    var name = _ref6.name,
+      isSandbox = _ref6.isSandbox;
     return (0, _react2.jsx)(_index.Item, {
       key: name,
       textValue: name
     }, name, isSandbox ? (0, _react2.jsx)(_index.Badge, {
       label: "SANDBOX",
       variant: "environmentBadge",
-      bg: "neutral.40"
+      bg: "neutral.40",
+      align: "right"
     }) : null);
   });
 };
 exports.DefaultOpen = DefaultOpen;
 var ControlledMenu = function ControlledMenu() {
-  var _useState13 = (0, _react.useState)(false),
+  var _useState11 = (0, _react.useState)(false),
+    _useState12 = (0, _slicedToArray2["default"])(_useState11, 2),
+    isOpen = _useState12[0],
+    setIsOpen = _useState12[1];
+  var _useState13 = (0, _react.useState)(defaultEnvironments[0]),
     _useState14 = (0, _slicedToArray2["default"])(_useState13, 2),
-    isOpen = _useState14[0],
-    setIsOpen = _useState14[1];
-  var _useState15 = (0, _react.useState)(defaultEnvironments[0]),
-    _useState16 = (0, _slicedToArray2["default"])(_useState15, 2),
-    selectedEnvironment = _useState16[0],
-    setSelectedEnvironment = _useState16[1];
+    selectedEnvironment = _useState14[0],
+    setSelectedEnvironment = _useState14[1];
   var envNode = (0, _react2.jsx)(_index.Box, {
     isRow: true,
     key: selectedEnvironment.name
@@ -401,8 +349,8 @@ var ControlledMenu = function ControlledMenu() {
     bg: "neutral.40"
   }) : null);
   var findEnvObj = function findEnvObj(envName) {
-    return (0, _find["default"])(defaultEnvironments).call(defaultEnvironments, function (_ref9) {
-      var name = _ref9.name;
+    return (0, _find["default"])(defaultEnvironments).call(defaultEnvironments, function (_ref7) {
+      var name = _ref7.name;
       return name === envName;
     });
   };
@@ -412,87 +360,14 @@ var ControlledMenu = function ControlledMenu() {
   };
   return (0, _react2.jsx)(_index.EnvironmentBreadcrumb, {
     items: defaultEnvironments,
-    name: "Globochem",
+    name: "Organization",
     selectedItem: envNode,
     onSelectionChange: handleSelectionChange,
     isOpen: isOpen,
     onOpenChange: setIsOpen
-  }, function (_ref10) {
-    var name = _ref10.name,
-      isSandbox = _ref10.isSandbox;
-    return (0, _react2.jsx)(_index.Item, {
-      key: name,
-      textValue: name
-    }, name, isSandbox ? (0, _react2.jsx)(_index.Badge, {
-      label: "SANDBOX",
-      variant: "environmentBadge",
-      bg: "neutral.40"
-    }) : null);
-  });
-};
-exports.ControlledMenu = ControlledMenu;
-var RightAlignedBadges = function RightAlignedBadges(args) {
-  var items = [{
-    name: 'Default'
-  }, {
-    name: 'Kangaroo',
-    isSandbox: true
-  }, {
-    name: 'Snake',
-    isSandbox: true
-  }, {
-    name: 'Snail'
-  }, {
-    name: 'Slug',
-    isSandbox: true
-  }, {
-    name: 'Crow'
-  }, {
-    name: 'Dog'
-  }, {
-    name: 'Crab',
-    isSandbox: true
-  }, {
-    name: 'Fish',
-    isSandbox: true
-  }, {
-    name: 'Turtle',
-    isSandbox: true
-  }, {
-    name: 'Mouse'
-  }];
-  var _useState17 = (0, _react.useState)(items[0]),
-    _useState18 = (0, _slicedToArray2["default"])(_useState17, 2),
-    selectedEnvironment = _useState18[0],
-    setSelectedEnvironment = _useState18[1];
-  var envNode = (0, _react2.jsx)(_index.Box, {
-    isRow: true,
-    key: selectedEnvironment.name
-  }, (0, _react2.jsx)(_index.Text, {
-    color: "inherit"
-  }, selectedEnvironment.name), selectedEnvironment.isSandbox ? (0, _react2.jsx)(_index.Badge, {
-    label: "SANDBOX",
-    variant: "environmentBadge",
-    bg: "neutral.40"
-  }) : null);
-  var findEnvObj = function findEnvObj(envName) {
-    return (0, _find["default"])(items).call(items, function (_ref11) {
-      var name = _ref11.name;
-      return name === envName;
-    });
-  };
-  var handleSelectionChange = function handleSelectionChange(newEnvName) {
-    var envObj = findEnvObj(newEnvName);
-    if ((0, _typeof2["default"])(envObj) === 'object') setSelectedEnvironment(_objectSpread({}, envObj));
-  };
-  return (0, _react2.jsx)(_index.EnvironmentBreadcrumb, (0, _extends2["default"])({}, args, {
-    items: items,
-    name: "Globochem",
-    selectedItem: envNode,
-    onSelectionChange: handleSelectionChange
-  }), function (_ref12) {
-    var name = _ref12.name,
-      isSandbox = _ref12.isSandbox;
+  }, function (_ref8) {
+    var name = _ref8.name,
+      isSandbox = _ref8.isSandbox;
     return (0, _react2.jsx)(_index.Item, {
       key: name,
       textValue: name
@@ -504,4 +379,4 @@ var RightAlignedBadges = function RightAlignedBadges(args) {
     }) : null);
   });
 };
-exports.RightAlignedBadges = RightAlignedBadges;
+exports.ControlledMenu = ControlledMenu;

package/lib/cjs/styles/templates/Nav/HeaderBar.js

@@ -64,7 +64,7 @@ var HeaderBar = function HeaderBar() {
     isRow: true,
     alignItems: "center",
     justifyContent: "space-between"
-  }, (0, _react2.jsx)(_EnvironmentBreadcrumb.DefaultClosed, null), (0, _react2.jsx)(_index.Box, {
+  }, (0, _react2.jsx)(_EnvironmentBreadcrumb.Default, null), (0, _react2.jsx)(_index.Box, {
     isRow: true
   }, (0, _react2.jsx)(_index.Box, {
     isRow: true,

package/lib/components/EnvironmentBreadcrumb/EnvironmentBreadcrumb.js

@@ -254,7 +254,6 @@ var EnvironmentBreadcrumb = /*#__PURE__*/forwardRef(function (props, ref) {
     onClose: handlePopoverClose,
     hasNoArrow: true,
     isDismissable: true,
-    p: 10,
     role: "presentation"
   }), ___EmotionJSX(FocusScope, {
     restoreFocus: true,
@@ -266,7 +265,8 @@ var EnvironmentBreadcrumb = /*#__PURE__*/forwardRef(function (props, ref) {
     placeholder: "Search",
     "aria-label": "Items Search",
     "data-testid": "Environment-Breadcrumb-Search",
-    onChange: setSearchValue
+    onChange: setSearchValue,
+    p: "10px"
   }, searchProps)), ___EmotionJSX(VisuallyHidden, {
     role: "alert",
     "aria-live": "polite",

package/lib/components/EnvironmentBreadcrumb/EnvironmentBreadcrumb.stories.js

@@ -99,17 +99,6 @@ var environmentsWithSections = [{
   }, {
     name: 'Mine'
   }]
-}, {
-  name: 'Other',
-  key: 'Other',
-  options: [{
-    name: 'Default'
-  }, {
-    name: 'Auth test',
-    isSandbox: true
-  }, {
-    name: 'Mike’s Workforce'
-  }]
 }];
 export var Default = function Default(args) {
   var _useState = useState(defaultEnvironments[0]),
@@ -138,7 +127,7 @@ export var Default = function Default(args) {
   };
   return ___EmotionJSX(EnvironmentBreadcrumb, _extends({}, args, {
     items: defaultEnvironments,
-    name: "Globochem",
+    name: "Organization",
     selectedItem: envNode,
     onSelectionChange: handleSelectionChange
   }), function (_ref2) {
@@ -150,50 +139,8 @@ export var Default = function Default(args) {
     }, name, isSandbox ? ___EmotionJSX(Badge, {
       label: "SANDBOX",
       variant: "environmentBadge",
-      bg: "neutral.40"
-    }) : null);
-  });
-};
-export var DefaultClosed = function DefaultClosed(args) {
-  var _useState3 = useState(defaultEnvironments[0]),
-    _useState4 = _slicedToArray(_useState3, 2),
-    selectedEnvironment = _useState4[0],
-    setSelectedEnvironment = _useState4[1];
-  var envNode = ___EmotionJSX(Box, {
-    isRow: true,
-    key: selectedEnvironment.name
-  }, ___EmotionJSX(Text, {
-    color: "inherit"
-  }, selectedEnvironment.name), selectedEnvironment.isSandbox ? ___EmotionJSX(Badge, {
-    label: "SANDBOX",
-    variant: "environmentBadge",
-    bg: "neutral.40"
-  }) : null);
-  var findEnvObj = function findEnvObj(envName) {
-    return _findInstanceProperty(defaultEnvironments).call(defaultEnvironments, function (_ref3) {
-      var name = _ref3.name;
-      return name === envName;
-    });
-  };
-  var handleSelectionChange = function handleSelectionChange(newEnvName) {
-    var envObj = findEnvObj(newEnvName);
-    if (_typeof(envObj) === 'object') setSelectedEnvironment(_objectSpread({}, envObj));
-  };
-  return ___EmotionJSX(EnvironmentBreadcrumb, _extends({}, args, {
-    items: defaultEnvironments,
-    name: "Globochem",
-    selectedItem: envNode,
-    onSelectionChange: handleSelectionChange
-  }), function (_ref4) {
-    var name = _ref4.name,
-      isSandbox = _ref4.isSandbox;
-    return ___EmotionJSX(Item, {
-      key: name,
-      textValue: name
-    }, name, isSandbox ? ___EmotionJSX(Badge, {
-      label: "SANDBOX",
-      variant: "environmentBadge",
-      bg: "neutral.40"
+      bg: "neutral.40",
+      align: "right"
     }) : null);
   });
 };
@@ -201,18 +148,18 @@ export var WithSections = function WithSections() {
   var _context, _context2;
   var selectedSectionIndex = 0;
   var selectedOptionIndex = 0;
-  var _useState5 = useState(environmentsWithSections),
+  var _useState3 = useState(environmentsWithSections),
+    _useState4 = _slicedToArray(_useState3, 2),
+    environments = _useState4[0],
+    setEnvironments = _useState4[1];
+  var _useState5 = useState(null),
     _useState6 = _slicedToArray(_useState5, 2),
-    environments = _useState6[0],
-    setEnvironments = _useState6[1];
-  var _useState7 = useState(null),
+    filteredOptionsNumber = _useState6[0],
+    setFilteredOptionsNumber = _useState6[1];
+  var _useState7 = useState(environmentsWithSections[selectedSectionIndex].options && environmentsWithSections[selectedSectionIndex].options[selectedOptionIndex]),
     _useState8 = _slicedToArray(_useState7, 2),
-    filteredOptionsNumber = _useState8[0],
-    setFilteredOptionsNumber = _useState8[1];
-  var _useState9 = useState(environmentsWithSections[selectedSectionIndex].options && environmentsWithSections[selectedSectionIndex].options[selectedOptionIndex]),
-    _useState10 = _slicedToArray(_useState9, 2),
-    selectedEnvironment = _useState10[0],
-    setSelectedEnvironment = _useState10[1];
+    selectedEnvironment = _useState8[0],
+    setSelectedEnvironment = _useState8[1];
   var selectedKey = _concatInstanceProperty(_context = "".concat(environmentsWithSections[selectedSectionIndex].key, "-")).call(_context, selectedEnvironment === null || selectedEnvironment === void 0 ? void 0 : selectedEnvironment.name);
   var recentEnvShown = 3;
   var totalOptionsNumber = _reduceInstanceProperty(environmentsWithSections).call(environmentsWithSections, function (acc, section) {
@@ -281,25 +228,25 @@ export var WithSections = function WithSections() {
   }) : null);
   return ___EmotionJSX(EnvironmentBreadcrumb, {
     items: environments,
-    name: "Globochem",
+    name: "Organization",
     selectedItem: envNode,
     onSelectionChange: handleEnvPress,
     onFilteredOptionsNumber: setFilteredOptionsNumber,
     optionsCountMessage: optionsCountMessage,
     isDefaultOpen: true
-  }, function (_ref5) {
-    var sectionName = _ref5.name,
-      sectionOptions = _ref5.options,
-      sectionKey = _ref5.key;
+  }, function (_ref3) {
+    var sectionName = _ref3.name,
+      sectionOptions = _ref3.options,
+      sectionKey = _ref3.key;
     return ___EmotionJSX(Section, {
       key: sectionKey,
       title: sectionName,
       items: sectionOptions
-    }, function (_ref6) {
+    }, function (_ref4) {
       var _context7;
-      var itemName = _ref6.name,
-        itemOptions = _ref6.options,
-        isSandbox = _ref6.isSandbox;
+      var itemName = _ref4.name,
+        itemOptions = _ref4.options,
+        isSandbox = _ref4.isSandbox;
       return ___EmotionJSX(Item, {
         key: _concatInstanceProperty(_context7 = "".concat(sectionName, "-")).call(_context7, itemName),
         childItems: itemOptions,
@@ -309,21 +256,22 @@ export var WithSections = function WithSections() {
       }, itemName, isSandbox ? ___EmotionJSX(Badge, {
         label: "SANDBOX",
         variant: "environmentBadge",
-        bg: "neutral.40"
+        bg: "neutral.40",
+        align: "right"
       }) : null));
     });
   });
 };
 export var OrgLevel = function OrgLevel() {
   return ___EmotionJSX(EnvironmentBreadcrumb, {
-    name: "Globochem"
+    name: "Organization"
   });
 };
 export var DefaultOpen = function DefaultOpen() {
-  var _useState11 = useState(defaultEnvironments[0]),
-    _useState12 = _slicedToArray(_useState11, 2),
-    selectedEnvironment = _useState12[0],
-    setSelectedEnvironment = _useState12[1];
+  var _useState9 = useState(defaultEnvironments[0]),
+    _useState10 = _slicedToArray(_useState9, 2),
+    selectedEnvironment = _useState10[0],
+    setSelectedEnvironment = _useState10[1];
   var envNode = ___EmotionJSX(Box, {
     isRow: true,
     key: selectedEnvironment.name
@@ -335,8 +283,8 @@ export var DefaultOpen = function DefaultOpen() {
     bg: "neutral.40"
   }) : null);
   var findEnvObj = function findEnvObj(envName) {
-    return _findInstanceProperty(defaultEnvironments).call(defaultEnvironments, function (_ref7) {
-      var name = _ref7.name;
+    return _findInstanceProperty(defaultEnvironments).call(defaultEnvironments, function (_ref5) {
+      var name = _ref5.name;
       return name === envName;
     });
   };
@@ -346,32 +294,33 @@ export var DefaultOpen = function DefaultOpen() {
   };
   return ___EmotionJSX(EnvironmentBreadcrumb, {
     items: defaultEnvironments,
-    name: "Globochem",
+    name: "Organization",
     selectedItem: envNode,
     onSelectionChange: handleSelectionChange,
     isDefaultOpen: true
-  }, function (_ref8) {
-    var name = _ref8.name,
-      isSandbox = _ref8.isSandbox;
+  }, function (_ref6) {
+    var name = _ref6.name,
+      isSandbox = _ref6.isSandbox;
     return ___EmotionJSX(Item, {
       key: name,
       textValue: name
     }, name, isSandbox ? ___EmotionJSX(Badge, {
       label: "SANDBOX",
       variant: "environmentBadge",
-      bg: "neutral.40"
+      bg: "neutral.40",
+      align: "right"
     }) : null);
   });
 };
 export var ControlledMenu = function ControlledMenu() {
-  var _useState13 = useState(false),
+  var _useState11 = useState(false),
+    _useState12 = _slicedToArray(_useState11, 2),
+    isOpen = _useState12[0],
+    setIsOpen = _useState12[1];
+  var _useState13 = useState(defaultEnvironments[0]),
     _useState14 = _slicedToArray(_useState13, 2),
-    isOpen = _useState14[0],
-    setIsOpen = _useState14[1];
-  var _useState15 = useState(defaultEnvironments[0]),
-    _useState16 = _slicedToArray(_useState15, 2),
-    selectedEnvironment = _useState16[0],
-    setSelectedEnvironment = _useState16[1];
+    selectedEnvironment = _useState14[0],
+    setSelectedEnvironment = _useState14[1];
   var envNode = ___EmotionJSX(Box, {
     isRow: true,
     key: selectedEnvironment.name
@@ -383,8 +332,8 @@ export var ControlledMenu = function ControlledMenu() {
     bg: "neutral.40"
   }) : null);
   var findEnvObj = function findEnvObj(envName) {
-    return _findInstanceProperty(defaultEnvironments).call(defaultEnvironments, function (_ref9) {
-      var name = _ref9.name;
+    return _findInstanceProperty(defaultEnvironments).call(defaultEnvironments, function (_ref7) {
+      var name = _ref7.name;
       return name === envName;
     });
   };
@@ -394,86 +343,14 @@ export var ControlledMenu = function ControlledMenu() {
   };
   return ___EmotionJSX(EnvironmentBreadcrumb, {
     items: defaultEnvironments,
-    name: "Globochem",
+    name: "Organization",
     selectedItem: envNode,
     onSelectionChange: handleSelectionChange,
     isOpen: isOpen,
     onOpenChange: setIsOpen
-  }, function (_ref10) {
-    var name = _ref10.name,
-      isSandbox = _ref10.isSandbox;
-    return ___EmotionJSX(Item, {
-      key: name,
-      textValue: name
-    }, name, isSandbox ? ___EmotionJSX(Badge, {
-      label: "SANDBOX",
-      variant: "environmentBadge",
-      bg: "neutral.40"
-    }) : null);
-  });
-};
-export var RightAlignedBadges = function RightAlignedBadges(args) {
-  var items = [{
-    name: 'Default'
-  }, {
-    name: 'Kangaroo',
-    isSandbox: true
-  }, {
-    name: 'Snake',
-    isSandbox: true
-  }, {
-    name: 'Snail'
-  }, {
-    name: 'Slug',
-    isSandbox: true
-  }, {
-    name: 'Crow'
-  }, {
-    name: 'Dog'
-  }, {
-    name: 'Crab',
-    isSandbox: true
-  }, {
-    name: 'Fish',
-    isSandbox: true
-  }, {
-    name: 'Turtle',
-    isSandbox: true
-  }, {
-    name: 'Mouse'
-  }];
-  var _useState17 = useState(items[0]),
-    _useState18 = _slicedToArray(_useState17, 2),
-    selectedEnvironment = _useState18[0],
-    setSelectedEnvironment = _useState18[1];
-  var envNode = ___EmotionJSX(Box, {
-    isRow: true,
-    key: selectedEnvironment.name
-  }, ___EmotionJSX(Text, {
-    color: "inherit"
-  }, selectedEnvironment.name), selectedEnvironment.isSandbox ? ___EmotionJSX(Badge, {
-    label: "SANDBOX",
-    variant: "environmentBadge",
-    bg: "neutral.40"
-  }) : null);
-  var findEnvObj = function findEnvObj(envName) {
-    return _findInstanceProperty(items).call(items, function (_ref11) {
-      var name = _ref11.name;
-      return name === envName;
-    });
-  };
-  var handleSelectionChange = function handleSelectionChange(newEnvName) {
-    var envObj = findEnvObj(newEnvName);
-    if (_typeof(envObj) === 'object') setSelectedEnvironment(_objectSpread({}, envObj));
-  };
-  return ___EmotionJSX(EnvironmentBreadcrumb, _extends({}, args, {
-    items: items,
-    name: "Globochem",
-    selectedItem: envNode,
-    onSelectionChange: handleSelectionChange
-  }), function (_ref12) {
-    var name = _ref12.name,
-      isSandbox = _ref12.isSandbox;
+  }, function (_ref8) {
+    var name = _ref8.name,
+      isSandbox = _ref8.isSandbox;
     return ___EmotionJSX(Item, {
       key: name,
       textValue: name

package/lib/styles/templates/Nav/HeaderBar.js

@@ -3,7 +3,7 @@ import React, { useState } from 'react';
 import ExploreIcon from '@pingux/mdi-react/CompassOutlineIcon';
 import HelpCircleOutlineIcon from '@pingux/mdi-react/HelpCircleOutlineIcon';
 import MenuDownIcon from '@pingux/mdi-react/MenuDownIcon';
-import { DefaultClosed as EnvironmentBreadcrumb } from '../../../components/EnvironmentBreadcrumb/EnvironmentBreadcrumb.stories';
+import { Default as EnvironmentBreadcrumb } from '../../../components/EnvironmentBreadcrumb/EnvironmentBreadcrumb.stories';
 import { Box, Icon, IconButton, Item, Menu, OverlayProvider, PopoverMenu, Text } from '../../../index';
 import { PersonIcon } from './NavData';
 import { jsx as ___EmotionJSX } from "@emotion/react";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pingux/astro",
-  "version": "2.72.0-alpha.0",
+  "version": "2.72.0",
   "description": "React component library for Ping Identity's design system",
   "repository": {
     "type": "git",