@pingux/astro 1.17.0-alpha.2 → 1.17.0-alpha.3

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

@@ -1,362 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
-
-var _typeof = require("@babel/runtime-corejs3/helpers/typeof");
-
-var _WeakMap = require("@babel/runtime-corejs3/core-js-stable/weak-map");
-
-var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
-
-var _Object$defineProperties = require("@babel/runtime-corejs3/core-js-stable/object/define-properties");
-
-var _Object$getOwnPropertyDescriptors = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors");
-
-var _forEachInstanceProperty2 = require("@babel/runtime-corejs3/core-js-stable/instance/for-each");
-
-var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
-
-var _filterInstanceProperty2 = require("@babel/runtime-corejs3/core-js-stable/instance/filter");
-
-var _Object$getOwnPropertySymbols = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols");
-
-var _Object$keys = require("@babel/runtime-corejs3/core-js-stable/object/keys");
-
-_Object$defineProperty(exports, "__esModule", {
-  value: true
-});
-
-exports["default"] = void 0;
-
-var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
-
-var _forEach = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/for-each"));
-
-var _filter = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/filter"));
-
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
-
-var _map = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/map"));
-
-var _from = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/array/from"));
-
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/slicedToArray"));
-
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/objectWithoutProperties"));
-
-var _react = _interopRequireWildcard(require("react"));
-
-var _i18n = require("@react-aria/i18n");
-
-var _ChevronRightIcon = _interopRequireDefault(require("mdi-react/ChevronRightIcon"));
-
-var _HomeIcon = _interopRequireDefault(require("mdi-react/HomeIcon"));
-
-var _propTypes = _interopRequireDefault(require("prop-types"));
-
-var _overlays = require("@react-stately/overlays");
-
-var _overlays2 = require("@react-aria/overlays");
-
-var _ArrowDropUpIcon = _interopRequireDefault(require("mdi-react/ArrowDropUpIcon"));
-
-var _ArrowDropDownIcon = _interopRequireDefault(require("mdi-react/ArrowDropDownIcon"));
-
-var _focus = require("@react-aria/focus");
-
-var _list = require("@react-stately/list");
-
-var _ListBox = _interopRequireDefault(require("../ListBox"));
-
-var _isIterable = require("../../utils/devUtils/props/isIterable");
-
-var _index = require("../../index");
-
-var _react2 = require("@emotion/react");
-
-var _excluded = ["children", "disabledKeys", "emptySearchText", "items", "itemsFilter", "onNamePress", "onPopoverClose", "onPopoverOpen", "onSelectionChange", "name", "searchProps", "selectedItem"];
-
-function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "function") return null; var cacheBabelInterop = new _WeakMap(); var cacheNodeInterop = new _WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = _Object$defineProperty && _Object$getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? _Object$getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { _Object$defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
-function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (_Object$getOwnPropertySymbols) { var symbols = _Object$getOwnPropertySymbols(object); enumerableOnly && (symbols = _filterInstanceProperty2(symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var _context2, _context3; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty2(_context2 = ownKeys(Object(source), !0)).call(_context2, function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : _forEachInstanceProperty2(_context3 = ownKeys(Object(source))).call(_context3, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
-
-/** The Environment Picker with Search and Sections support */
-var EnvironmentBreadcrumb = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
-  var children = props.children,
-      imperativeDisabledKeys = props.disabledKeys,
-      emptySearchText = props.emptySearchText,
-      items = props.items,
-      imperativeItemsFilter = props.itemsFilter,
-      onNamePress = props.onNamePress,
-      imperativeOnPopoverClose = props.onPopoverClose,
-      imperativeOnPopoverOpen = props.onPopoverOpen,
-      onSelectionChange = props.onSelectionChange,
-      name = props.name,
-      searchProps = props.searchProps,
-      selectedItem = props.selectedItem,
-      others = (0, _objectWithoutProperties2["default"])(props, _excluded);
-
-  var _useState = (0, _react.useState)(''),
-      _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
-      searchValue = _useState2[0],
-      setSearchValue = _useState2[1];
-
-  var _useState3 = (0, _react.useState)([]),
-      _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
-      selectedKeys = _useState4[0],
-      setSelectedKeys = _useState4[1];
-
-  var breadcrumbsRef = (0, _react.useRef)();
-
-  var overlayRef = _react["default"].useRef();
-
-  var triggerRef = _react["default"].useRef();
-
-  var scrollBoxRef = _react["default"].useRef();
-  /* istanbul ignore next */
-
-
-  (0, _react.useImperativeHandle)(ref, function () {
-    return breadcrumbsRef.current;
-  });
-
-  var _useFilter = (0, _i18n.useFilter)({
-    sensitivity: 'base'
-  }),
-      contains = _useFilter.contains;
-
-  var filterNodesWithChildren = function filterNodesWithChildren(iterableNode) {
-    var nodeArr = (0, _from["default"])(iterableNode); // with this function we are filtering child items if they have sections
-    // we can't filter items because if it would be a section - we can't change childNodes
-    // eslint-disable-next-line array-callback-return,consistent-return
-
-    var filteredSections = (0, _map["default"])(nodeArr).call(nodeArr, function f(nodeItem) {
-      if ((nodeItem === null || nodeItem === void 0 ? void 0 : nodeItem.type) === 'item') {
-        var _nodeItem$value;
-
-        return contains(nodeItem === null || nodeItem === void 0 ? void 0 : (_nodeItem$value = nodeItem.value) === null || _nodeItem$value === void 0 ? void 0 : _nodeItem$value.name, searchValue) ? nodeItem : null;
-      }
-
-      if ((nodeItem === null || nodeItem === void 0 ? void 0 : nodeItem.type) === 'section') {
-        var _context;
-
-        return _objectSpread(_objectSpread({}, nodeItem), {}, {
-          childNodes: (0, _filter["default"])(_context = (0, _from["default"])(nodeItem.childNodes)).call(_context, f)
-        });
-      }
-    }); // we are filtering null items here since we were not able to filter them in previous function
-
-    return (0, _filter["default"])(filteredSections).call(filteredSections, function (item) {
-      return item;
-    });
-  };
-
-  var popoverState = (0, _overlays.useOverlayTriggerState)({});
-  var handlePopoverClose = (0, _react.useCallback)(function () {
-    if (imperativeOnPopoverClose) {
-      imperativeOnPopoverClose();
-    }
-
-    setSearchValue('');
-    popoverState.close();
-  }, [imperativeOnPopoverClose, popoverState]);
-  var handleSelectionChange = (0, _react.useCallback)(function (selectedItemSet) {
-    var _selectedItemSet = (0, _slicedToArray2["default"])(selectedItemSet, 1),
-        selectedItemKey = _selectedItemSet[0];
-
-    setSelectedKeys(selectedItemSet);
-    onSelectionChange(selectedItemKey);
-    handlePopoverClose();
-  }, [handlePopoverClose, onSelectionChange]);
-  var listBoxProps = {
-    children: children,
-    disabledKeys: imperativeDisabledKeys,
-    items: items,
-    filter: imperativeItemsFilter || filterNodesWithChildren,
-    onSelectionChange: handleSelectionChange,
-    selectedKeys: selectedKeys,
-    selectionMode: 'single',
-    disallowEmptySelection: false
-  };
-  var listBoxState = (0, _list.useListState)(listBoxProps); // this function is recursively going through the children to see
-  // whether there are some items so that means that the array isn't empty
-
-  var checkIfListEmpty = (0, _react.useCallback)(function () {
-    // from the beginning we are assuming that the list is empty
-    // variable is not isListEmpty because checks below if(isListHasItems) is clearer
-    // to read than if(!isListEmpty) IMO
-    var isListHasItems = false; // eslint-disable-next-line consistent-return
-
-    (function f(listState) {
-      var _listState$collection;
-
-      // if the list has items - we don't need to go deeper into the recursion
-      if (isListHasItems) {
-        return;
-      } // here we are checking where are listItems array is stored
-
-
-      var listItemsArr = (listState === null || listState === void 0 ? void 0 : (_listState$collection = listState.collection) === null || _listState$collection === void 0 ? void 0 : _listState$collection.iterable) || (listState === null || listState === void 0 ? void 0 : listState.childNodes);
-
-      if ((listItemsArr === null || listItemsArr === void 0 ? void 0 : listItemsArr.length) > 0) {
-        // if there are a few listItems we are checking their types (can be sections) - if we have
-        // a few of 'items' type - we know that the list is not empty
-        if (listItemsArr[0].type === 'item') {
-          isListHasItems = true;
-        } else {
-          // this path will be taken if there are a few 'sections'
-          // - we need to go check them recursively
-          (0, _forEach["default"])(listItemsArr).call(listItemsArr, function (item) {
-            return f(item);
-          });
-        }
-      }
-    })(listBoxState);
-
-    return !isListHasItems;
-  }, [listBoxState]);
-
-  var _useOverlayTrigger = (0, _overlays2.useOverlayTrigger)({
-    type: 'listbox'
-  }, popoverState, triggerRef),
-      triggerProps = _useOverlayTrigger.triggerProps,
-      overlayProps = _useOverlayTrigger.overlayProps;
-
-  var handlePopoverOpen = function handlePopoverOpen() {
-    if (imperativeOnPopoverOpen) {
-      imperativeOnPopoverOpen();
-    }
-
-    popoverState.open();
-  };
-
-  var _useOverlayPosition = (0, _overlays2.useOverlayPosition)({
-    isOpen: popoverState.isOpen,
-    offset: 6,
-    onClose: handlePopoverClose,
-    overlayRef: overlayRef,
-    scrollRef: scrollBoxRef,
-    shouldUpdatePosition: true,
-    targetRef: triggerRef
-  }),
-      positionProps = _useOverlayPosition.overlayProps;
-
-  var EmptyListState = (0, _react2.jsx)(_index.Text, {
-    py: 10,
-    px: 15
-  }, emptySearchText);
-
-  var _selectedKeys = (0, _slicedToArray2["default"])(selectedKeys, 1),
-      selectedValue = _selectedKeys[0];
-
-  var ItemsSelect = (0, _react2.jsx)(_react["default"].Fragment, null, (0, _react2.jsx)(_index.Button, (0, _extends2["default"])({}, triggerProps, {
-    onPress: handlePopoverOpen,
-    ref: triggerRef,
-    variant: "environmentBreadcrumb.current",
-    "aria-label": "".concat((typeof selectedItem === 'string' ? selectedItem : selectedValue) || 'Selected Item')
-  }), selectedItem, (0, _react2.jsx)(_index.Icon, {
-    icon: popoverState.isOpen ? _ArrowDropUpIcon["default"] : _ArrowDropDownIcon["default"]
-  })), (0, _react2.jsx)(_index.PopoverContainer, (0, _extends2["default"])({}, overlayProps, positionProps, {
-    ref: overlayRef,
-    isOpen: popoverState.isOpen,
-    scrollRef: scrollBoxRef,
-    onClose: handlePopoverClose,
-    hasNoArrow: true,
-    isDismissable: true,
-    p: 10
-  }), (0, _react2.jsx)(_focus.FocusScope, {
-    restoreFocus: true,
-    autoFocus: true,
-    contain: true
-  }, (0, _react2.jsx)(_index.ScrollBox, {
-    ref: scrollBoxRef
-  }, (0, _react2.jsx)(_index.SearchField, (0, _extends2["default"])({
-    placeholder: "Search",
-    "aria-label": "Items Search",
-    "data-testid": "Environment-Breadcrumb-Search",
-    containerProps: {
-      // this one is needed to cancel default scrollBox items behavior
-      sx: {
-        overflow: 'visible'
-      }
-    },
-    onChange: setSearchValue
-  }, searchProps)), checkIfListEmpty() ? EmptyListState : (0, _react2.jsx)(_ListBox["default"], {
-    state: listBoxState,
-    "aria-label": "Items List"
-  })))));
-  var handleOnAction = (0, _react.useCallback)(function (actionKey) {
-    if (actionKey === 'name' && onNamePress) {
-      onNamePress();
-    }
-  }, [onNamePress]);
-  return (0, _react2.jsx)(_index.Breadcrumbs, (0, _extends2["default"])({
-    icon: _ChevronRightIcon["default"],
-    ref: breadcrumbsRef,
-    onAction: handleOnAction,
-    iconProps: {
-      color: 'neutral.70',
-      mx: 5,
-      size: 16
-    }
-  }, others), (0, _react2.jsx)(_index.Item, {
-    key: "name",
-    variant: "environmentBreadcrumb.current",
-    "data-testid": "name",
-    "aria-label": name,
-    elementType: "Button"
-  }, (0, _react2.jsx)(_index.Icon, {
-    icon: _HomeIcon["default"],
-    mr: 7
-  }), name), selectedItem && (0, _react2.jsx)(_index.Item, {
-    key: "itemsSelect",
-    elementType: "Fragment"
-  }, ItemsSelect));
-});
-var _default = EnvironmentBreadcrumb;
-exports["default"] = _default;
-EnvironmentBreadcrumb.propTypes = {
-  /** Callback function that fires when the selected key changes. */
-  onSelectionChange: _propTypes["default"].func,
-
-  /** Current environment */
-  selectedItem: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].node]),
-
-  /** Displayed name */
-  name: _propTypes["default"].string,
-
-  /** Callback function that fires when name pressed */
-  onNamePress: _propTypes["default"].func,
-
-  /** The list of environments. */
-  items: _isIterable.isIterableProp,
-
-  /**
-   * Filter function to generate a filtered list of nodes.
-   *
-   * `(nodes: Iterable<Node>) => Iterable<Node>`
-   */
-  itemsFilter: _propTypes["default"].func,
-
-  /** Callback function that fires when the dropdown is opened. */
-  onPopoverOpen: _propTypes["default"].func,
-
-  /** Callback function that fires when the dropdown is closed. */
-  onPopoverClose: _propTypes["default"].func,
-
-  /** Props object that is spread directly into the SearchField element. */
-  searchProps: _propTypes["default"].shape({}),
-
-  /** Array of keys to disable within the options list. */
-  disabledKeys: _propTypes["default"].arrayOf(_propTypes["default"].string),
-
-  /** Text that will be shown if no search results found. */
-  emptySearchText: _propTypes["default"].string
-};
-EnvironmentBreadcrumb.defaultProps = {
-  emptySearchText: 'No Search Result'
-};

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

@@ -1,301 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
-
-var _typeof = require("@babel/runtime-corejs3/helpers/typeof");
-
-var _WeakMap = require("@babel/runtime-corejs3/core-js-stable/weak-map");
-
-var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
-
-var _Object$defineProperties = require("@babel/runtime-corejs3/core-js-stable/object/define-properties");
-
-var _Object$getOwnPropertyDescriptors = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors");
-
-var _forEachInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/for-each");
-
-var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
-
-var _filterInstanceProperty2 = require("@babel/runtime-corejs3/core-js-stable/instance/filter");
-
-var _Object$getOwnPropertySymbols = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols");
-
-var _Object$keys = require("@babel/runtime-corejs3/core-js-stable/object/keys");
-
-_Object$defineProperty(exports, "__esModule", {
-  value: true
-});
-
-exports["default"] = exports.WithSections = exports.OrgLevel = exports.Default = void 0;
-
-var _map = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/map"));
-
-var _indexOf = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/index-of"));
-
-var _slice = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/slice"));
-
-var _concat = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/concat"));
-
-var _filter = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/filter"));
-
-var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
-
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
-
-var _find = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/find"));
-
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/slicedToArray"));
-
-var _react = _interopRequireWildcard(require("react"));
-
-var _EnvironmentBreadcrumb = _interopRequireDefault(require("./EnvironmentBreadcrumb"));
-
-var _index = require("../../index");
-
-var _react2 = require("@emotion/react");
-
-function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "function") return null; var cacheBabelInterop = new _WeakMap(); var cacheNodeInterop = new _WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = _Object$defineProperty && _Object$getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? _Object$getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { _Object$defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
-function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (_Object$getOwnPropertySymbols) { var symbols = _Object$getOwnPropertySymbols(object); enumerableOnly && (symbols = _filterInstanceProperty2(symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var _context6, _context7; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context6 = ownKeys(Object(source), !0)).call(_context6, function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : _forEachInstanceProperty(_context7 = ownKeys(Object(source))).call(_context7, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
-
-var _default = {
-  title: 'EnvironmentBreadcrumb',
-  component: _EnvironmentBreadcrumb["default"]
-};
-exports["default"] = _default;
-var defaultEnvironments = [{
-  name: 'Default'
-}, {
-  name: 'Kangaroo'
-}, {
-  name: 'Snake'
-}, {
-  name: 'Snail'
-}, {
-  name: 'Slug'
-}, {
-  name: 'Crow'
-}, {
-  name: 'Dog'
-}, {
-  name: 'Crab',
-  isSandbox: true
-}, {
-  name: 'Fish'
-}, {
-  name: 'Turtle'
-}, {
-  name: 'Mouse'
-}, {
-  name: 'Banana'
-}, {
-  name: 'Shark'
-}, {
-  name: 'Gorilla'
-}, {
-  name: 'Goat'
-}];
-var environmentsWithSections = [{
-  name: 'Recent',
-  options: [{
-    name: 'Default'
-  }, {
-    name: 'Consumer Banking Prod'
-  }, {
-    name: 'Custom 360 Test'
-  }]
-}, {
-  name: 'All',
-  options: [{
-    name: 'Consumer Banking Prod'
-  }, {
-    name: 'Custom 360 Test'
-  }, {
-    name: 'Default'
-  }, {
-    name: 'Great New One',
-    isSandbox: true
-  }, {
-    name: 'Jeff’s Workforce'
-  }, {
-    name: 'Lindemuller Prod'
-  }, {
-    name: 'Mine'
-  }]
-}];
-
-var Default = function Default(args) {
-  var _useState = (0, _react.useState)({
-    name: 'Snail',
-    isSandbox: true
-  }),
-      _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
-      selectedEnvironment = _useState2[0],
-      setSelectedEnvironment = _useState2[1];
-
-  var envNode = (0, _react2.jsx)(_index.Box, {
-    isRow: true
-  }, (0, _react2.jsx)(_index.Text, {
-    color: "inherit"
-  }, selectedEnvironment.name), selectedEnvironment.isSandbox ? (0, _react2.jsx)(_index.Chip, {
-    label: "SANDBOX",
-    variant: "boxes.environmentChip",
-    bg: "neutral.40"
-  }) : null);
-
-  var findEnvObj = function findEnvObj(envName) {
-    return (0, _find["default"])(defaultEnvironments).call(defaultEnvironments, function (_ref) {
-      var name = _ref.name;
-      return name === envName;
-    });
-  };
-
-  var handleSelectionChange = function handleSelectionChange(newEnvName) {
-    var envObj = findEnvObj(newEnvName);
-    setSelectedEnvironment(_objectSpread({}, envObj));
-  };
-
-  return (0, _react2.jsx)(_EnvironmentBreadcrumb["default"], (0, _extends2["default"])({}, args, {
-    items: defaultEnvironments,
-    name: "Globochem",
-    selectedItem: envNode,
-    onSelectionChange: handleSelectionChange
-  }), function (_ref2) {
-    var name = _ref2.name,
-        isSandbox = _ref2.isSandbox;
-    return (0, _react2.jsx)(_index.Item, {
-      key: name,
-      textValue: name
-    }, name, isSandbox ? (0, _react2.jsx)(_index.Chip, {
-      label: "SANDBOX",
-      variant: "boxes.environmentChip",
-      bg: "neutral.40"
-    }) : null);
-  });
-};
-
-exports.Default = Default;
-
-var WithSections = function WithSections() {
-  var _useState3 = (0, _react.useState)(environmentsWithSections),
-      _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
-      environments = _useState4[0],
-      setEnvironments = _useState4[1];
-
-  var _useState5 = (0, _react.useState)({
-    name: 'Consumer Banking Prod'
-  }),
-      _useState6 = (0, _slicedToArray2["default"])(_useState5, 2),
-      selectedEnvironment = _useState6[0],
-      setSelectedEnvironment = _useState6[1];
-
-  var recentEnvShown = 3;
-
-  var getUpdatedRecentEnvs = function getUpdatedRecentEnvs(envObj, prevEnvs) {
-    var _context3;
-
-    var envName = envObj.name;
-    var isDuplicate = (0, _filter["default"])(prevEnvs).call(prevEnvs, function (prevEnv) {
-      return prevEnv.name === envName;
-    }).length > 0;
-
-    if (isDuplicate) {
-      var _context;
-
-      return (0, _concat["default"])(_context = [_objectSpread({}, envObj)]).call(_context, (0, _filter["default"])(prevEnvs).call(prevEnvs, function (prevEnv) {
-        return prevEnv.name !== envName;
-      }));
-    }
-
-    if (prevEnvs.length >= recentEnvShown) {
-      var _context2;
-
-      return (0, _concat["default"])(_context2 = [_objectSpread({}, envObj)]).call(_context2, (0, _slice["default"])(prevEnvs).call(prevEnvs, 0, recentEnvShown - 1));
-    }
-
-    return (0, _concat["default"])(_context3 = [_objectSpread({}, envObj)]).call(_context3, prevEnvs);
-  };
-
-  var findEnvObj = function findEnvObj(envName) {
-    var _context4;
-
-    return (0, _find["default"])(_context4 = (0, _find["default"])(environments).call(environments, function (section) {
-      return section.name === 'All';
-    }).options).call(_context4, function (option) {
-      return option.name === envName;
-    });
-  };
-
-  var handleEnvPress = function handleEnvPress(newEnv) {
-    var sectionPrefixIndex = (0, _indexOf["default"])(newEnv).call(newEnv, '-');
-    var envKey = newEnv.substr(sectionPrefixIndex + 1);
-    var recentEnvironments = (0, _find["default"])(environments).call(environments, function (envSection) {
-      return envSection.name === 'Recent';
-    }).options;
-    var envObj = findEnvObj(envKey);
-    var updatedRecentEnvironments = getUpdatedRecentEnvs(envObj, recentEnvironments);
-    setEnvironments(function (prevEnvs) {
-      return (0, _map["default"])(prevEnvs).call(prevEnvs, function (section) {
-        return section.name === 'Recent' ? _objectSpread(_objectSpread({}, section), {}, {
-          options: updatedRecentEnvironments
-        }) : section;
-      });
-    });
-    setSelectedEnvironment(_objectSpread({}, envObj));
-  };
-
-  var envNode = (0, _react2.jsx)(_index.Box, {
-    isRow: true
-  }, (0, _react2.jsx)(_index.Text, {
-    color: "inherit"
-  }, selectedEnvironment.name), selectedEnvironment.isSandbox ? (0, _react2.jsx)(_index.Chip, {
-    label: "SANDBOX",
-    variant: "boxes.environmentChip",
-    bg: "neutral.40"
-  }) : null);
-  return (0, _react2.jsx)(_EnvironmentBreadcrumb["default"], {
-    items: environments,
-    name: "Globochem",
-    selectedItem: envNode,
-    onSelectionChange: handleEnvPress
-  }, function (_ref3) {
-    var sectionName = _ref3.name,
-        sectionOptions = _ref3.options;
-    return (0, _react2.jsx)(_index.Section, {
-      key: sectionName,
-      title: sectionName,
-      items: sectionOptions
-    }, function (_ref4) {
-      var _context5;
-
-      var itemName = _ref4.name,
-          itemOptions = _ref4.options,
-          isSandbox = _ref4.isSandbox;
-      return (0, _react2.jsx)(_index.Item, {
-        key: (0, _concat["default"])(_context5 = "".concat(sectionName, "-")).call(_context5, itemName),
-        childItems: itemOptions,
-        textValue: itemName
-      }, (0, _react2.jsx)(_index.Box, {
-        isRow: true
-      }, itemName, isSandbox ? (0, _react2.jsx)(_index.Chip, {
-        label: "SANDBOX",
-        variant: "boxes.environmentChip",
-        bg: "neutral.40"
-      }) : null));
-    });
-  });
-};
-
-exports.WithSections = WithSections;
-
-var OrgLevel = function OrgLevel() {
-  return (0, _react2.jsx)(_EnvironmentBreadcrumb["default"], {
-    name: "Globochem"
-  });
-};
-
-exports.OrgLevel = OrgLevel;