@canonical/react-components 1.3.1 → 1.3.2

package/dist-esm/components/MultiSelect/MultiSelect.js

@@ -1,308 +0,0 @@
-import _pt from "prop-types";
-var _excluded = ["items", "selectedItems", "disabledItems", "header", "updateItems", "onSelectItem", "onDeselectItem", "isOpen", "footer", "sortFn", "groupFn"];
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], t.indexOf(o) >= 0 || {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
-function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (e.indexOf(n) >= 0) continue; t[n] = r[n]; } return t; }
-import React, { useEffect, useId, useMemo, useRef, useState } from "react";
-import "./MultiSelect.scss";
-import { Button, CheckboxInput, ContextualMenu, SearchBox } from "../../index";
-import { FadeInDown } from "./FadeInDown";
-var sortAlphabetically = (a, b) => {
-  return a.label.localeCompare(b.label, "en", {
-    numeric: true
-  });
-};
-var createSortSelectedItems = previouslySelectedItemValues => (a, b) => {
-  if (previouslySelectedItemValues) {
-    var aIsPreviouslySelected = previouslySelectedItemValues.has(a.value);
-    var bIsPreviouslySelected = previouslySelectedItemValues.has(b.value);
-    if (aIsPreviouslySelected && !bIsPreviouslySelected) return -1;
-    if (!aIsPreviouslySelected && bIsPreviouslySelected) return 1;
-  }
-  return 0;
-};
-var getGroupedItems = items => {
-  var groups = new Map();
-  items.forEach(item => {
-    var group = item.group || "Ungrouped";
-    var groupItems = groups.get(group) || [];
-    groupItems.push(item);
-    groups.set(group, groupItems);
-  });
-  return Array.from(groups, _ref => {
-    var [group, items] = _ref;
-    return {
-      group,
-      items
-    };
-  });
-};
-export var MultiSelectDropdown = _ref2 => {
-  var {
-      items,
-      selectedItems,
-      disabledItems,
-      header,
-      updateItems,
-      onSelectItem,
-      onDeselectItem,
-      isOpen,
-      footer,
-      sortFn = sortAlphabetically,
-      groupFn = getGroupedItems
-    } = _ref2,
-    props = _objectWithoutProperties(_ref2, _excluded);
-  var selectedItemValues = useMemo(() => new Set(selectedItems.map(item => item.value)), [selectedItems]);
-  var disabledItemValues = useMemo(() => new Set(disabledItems.map(item => item.value)), [disabledItems]);
-  var [previouslySelectedItemValues, setPreviouslySelectedItemValues] = useState(new Set(selectedItemValues));
-  useEffect(() => {
-    if (isOpen) {
-      setPreviouslySelectedItemValues(new Set(selectedItemValues));
-    }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [isOpen]);
-  var hasGroup = useMemo(() => items.some(item => item.group), [items]);
-  var groupedItems = useMemo(() => hasGroup ? groupFn(items) : [{
-    group: "Ungrouped",
-    items
-  }],
-  // eslint-disable-next-line react-hooks/exhaustive-deps
-  [items, groupFn]);
-  var handleOnChange = event => {
-    var {
-      checked,
-      value
-    } = event.target;
-    var foundItem = items.find(item => "".concat(item.value) === value);
-    if (foundItem) {
-      var _selectedItems$filter;
-      var newSelectedItems = checked ? [...selectedItems, foundItem] : (_selectedItems$filter = selectedItems.filter(item => "".concat(item.value) !== value)) !== null && _selectedItems$filter !== void 0 ? _selectedItems$filter : [];
-      updateItems(newSelectedItems);
-      if (checked) {
-        onSelectItem === null || onSelectItem === void 0 || onSelectItem(foundItem);
-      } else {
-        onDeselectItem === null || onDeselectItem === void 0 || onDeselectItem(foundItem);
-      }
-    }
-  };
-  return /*#__PURE__*/React.createElement(FadeInDown, {
-    isVisible: isOpen
-  }, /*#__PURE__*/React.createElement("div", _extends({
-    className: "multi-select__dropdown",
-    role: "listbox"
-  }, props), header ? header : null, groupedItems.map(_ref3 => {
-    var {
-      group,
-      items
-    } = _ref3;
-    return /*#__PURE__*/React.createElement("div", {
-      className: "multi-select__group",
-      key: group
-    }, hasGroup ? /*#__PURE__*/React.createElement("h5", {
-      className: "multi-select__dropdown-header"
-    }, group) : null, /*#__PURE__*/React.createElement("ul", {
-      className: "multi-select__dropdown-list",
-      "aria-label": group
-    }, items.sort(sortFn).sort(createSortSelectedItems(previouslySelectedItemValues)).map(item => /*#__PURE__*/React.createElement("li", {
-      key: item.value,
-      className: "multi-select__dropdown-item"
-    }, /*#__PURE__*/React.createElement(CheckboxInput, {
-      disabled: disabledItemValues.has(item.value),
-      label: item.label,
-      checked: selectedItemValues.has(item.value),
-      value: item.value,
-      onChange: handleOnChange,
-      key: item.value
-    })))));
-  }), footer ? /*#__PURE__*/React.createElement("div", {
-    className: "multi-select__footer"
-  }, footer) : null));
-};
-
-/**
- * Component allowing to select multiple items from a list of options.
- *
- * `MultiSelectDropdown` displays the dropdown with options which are grouped and sorted alphabetically.
- * `SearchBox` or `Button` is used to trigger the dropdown depending on the variant.
- */
-MultiSelectDropdown.propTypes = {
-  isOpen: _pt.bool.isRequired,
-  items: _pt.arrayOf(_pt.shape({
-    label: _pt.string.isRequired,
-    value: _pt.oneOfType([_pt.string, _pt.number]).isRequired,
-    group: _pt.string
-  })).isRequired,
-  selectedItems: _pt.arrayOf(_pt.shape({
-    label: _pt.string.isRequired,
-    value: _pt.oneOfType([_pt.string, _pt.number]).isRequired,
-    group: _pt.string
-  })).isRequired,
-  disabledItems: _pt.arrayOf(_pt.shape({
-    label: _pt.string.isRequired,
-    value: _pt.oneOfType([_pt.string, _pt.number]).isRequired,
-    group: _pt.string
-  })).isRequired,
-  header: _pt.node,
-  updateItems: _pt.func.isRequired,
-  onDeselectItem: _pt.func,
-  onSelectItem: _pt.func,
-  footer: _pt.node,
-  groupFn: _pt.func,
-  sortFn: _pt.any
-};
-export var MultiSelect = _ref4 => {
-  var {
-    disabled,
-    selectedItems: externalSelectedItems = [],
-    label,
-    listSelected = true,
-    onItemsUpdate,
-    onSelectItem,
-    onDeselectItem,
-    placeholder,
-    required = false,
-    items = [],
-    disabledItems = [],
-    dropdownHeader,
-    dropdownFooter,
-    showDropdownFooter = true,
-    variant = "search"
-  } = _ref4;
-  var buttonRef = useRef();
-  var [isDropdownOpen, setIsDropdownOpen] = useState(false);
-  var [filter, setFilter] = useState("");
-  var [internalSelectedItems, setInternalSelectedItems] = useState([]);
-  var selectedItems = externalSelectedItems || internalSelectedItems;
-  var updateItems = newItems => {
-    var uniqueItems = Array.from(new Set(newItems));
-    setInternalSelectedItems(uniqueItems);
-    onItemsUpdate && onItemsUpdate(uniqueItems);
-  };
-  var dropdownId = useId();
-  var inputId = useId();
-  var selectedItemsLabel = selectedItems.filter(selectedItem => items.some(item => item.value === selectedItem.value)).map(el => el.label).join(", ");
-  var footer = null;
-  if (showDropdownFooter) {
-    footer = dropdownFooter ? dropdownFooter : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Button, {
-      appearance: "link",
-      onClick: () => {
-        var enabledItems = items.filter(item => !disabledItems.some(disabledItem => disabledItem.value === item.value));
-        updateItems([...selectedItems, ...enabledItems]);
-      },
-      type: "button"
-    }, "Select all"), /*#__PURE__*/React.createElement(Button, {
-      appearance: "link",
-      onClick: () => {
-        var disabledSelectedItems = selectedItems.filter(item => disabledItems.some(disabledItem => disabledItem.value === item.value));
-        updateItems(disabledSelectedItems);
-      },
-      type: "button"
-    }, "Clear"));
-  }
-  return /*#__PURE__*/React.createElement(ContextualMenu, {
-    className: "multi-select",
-    onToggleMenu: isOpen => {
-      if (!isOpen) {
-        setFilter("");
-      }
-      // Handle syncing the state when toggling the menu from within the
-      // contextual menu component e.g. when clicking outside.
-      if (isOpen !== isDropdownOpen) {
-        setIsDropdownOpen(isOpen);
-      }
-    },
-    position: "left",
-    constrainPanelWidth: true,
-    toggle: variant === "search" ? /*#__PURE__*/React.createElement(SearchBox, {
-      externallyControlled: true,
-      "aria-controls": dropdownId,
-      "aria-expanded": isDropdownOpen,
-      id: inputId,
-      role: "combobox",
-      "aria-label": label || placeholder || "Search",
-      disabled: disabled,
-      autoComplete: "off",
-      onChange: value => {
-        setFilter(value);
-        // reopen if dropdown has been closed via ESC
-        setIsDropdownOpen(true);
-      },
-      onFocus: () => setIsDropdownOpen(true),
-      placeholder: placeholder !== null && placeholder !== void 0 ? placeholder : "Search",
-      required: required,
-      type: "text",
-      value: filter,
-      className: "multi-select__input"
-    }) : /*#__PURE__*/React.createElement("button", {
-      role: "combobox",
-      type: "button",
-      "aria-label": label || placeholder || "Select items",
-      "aria-controls": dropdownId,
-      "aria-expanded": isDropdownOpen,
-      className: "multi-select__select-button",
-      onClick: () => {
-        setIsDropdownOpen(!isDropdownOpen);
-      },
-      onMouseDown: event => {
-        // If the dropdown is open when this button is clicked the
-        // click-outside event will fire which will close the dropdown, but
-        // then the button click event will fire which will immediately
-        // reopen the dropdown.
-        // To prevent this we can stop the propagation to the click event
-        // while `isDropdownOpen` is still set to `true` (by the time we
-        // get to the `onClick` event `isDropdownOpen` will already be `false`,
-        // hence having to do this on mouse down).
-        if (isDropdownOpen) {
-          event.stopPropagation();
-        }
-      },
-      ref: buttonRef
-    }, /*#__PURE__*/React.createElement("span", {
-      className: "multi-select__condensed-text"
-    }, listSelected && selectedItems.length > 0 ? selectedItemsLabel : placeholder !== null && placeholder !== void 0 ? placeholder : "Select items")),
-    visible: isDropdownOpen
-  }, /*#__PURE__*/React.createElement(MultiSelectDropdown, {
-    id: dropdownId,
-    isOpen: isDropdownOpen,
-    items: filter.length > 0 ? items.filter(item => item.label.toLowerCase().includes(filter.toLowerCase())) : items,
-    selectedItems: selectedItems,
-    disabledItems: disabledItems,
-    header: dropdownHeader,
-    updateItems: updateItems,
-    onSelectItem: onSelectItem,
-    onDeselectItem: onDeselectItem,
-    footer: footer
-  }));
-};
-MultiSelect.propTypes = {
-  disabled: _pt.bool,
-  error: _pt.string,
-  selectedItems: _pt.arrayOf(_pt.shape({
-    label: _pt.string.isRequired,
-    value: _pt.oneOfType([_pt.string, _pt.number]).isRequired,
-    group: _pt.string
-  })),
-  help: _pt.string,
-  label: _pt.oneOfType([_pt.string, _pt.oneOf([null])]),
-  listSelected: _pt.bool,
-  onDeselectItem: _pt.func,
-  onItemsUpdate: _pt.func,
-  onSelectItem: _pt.func,
-  placeholder: _pt.string,
-  required: _pt.bool,
-  items: _pt.arrayOf(_pt.shape({
-    label: _pt.string.isRequired,
-    value: _pt.oneOfType([_pt.string, _pt.number]).isRequired,
-    group: _pt.string
-  })).isRequired,
-  disabledItems: _pt.arrayOf(_pt.shape({
-    label: _pt.string.isRequired,
-    value: _pt.oneOfType([_pt.string, _pt.number]).isRequired,
-    group: _pt.string
-  })),
-  renderItem: _pt.func,
-  dropdownHeader: _pt.node,
-  dropdownFooter: _pt.node,
-  showDropdownFooter: _pt.bool,
-  variant: _pt.oneOf(["condensed", "search"])
-};

package/dist-esm/components/MultiSelect/index.js

@@ -1 +0,0 @@
-export * from "./MultiSelect";

package/dist-esm/components/Navigation/Navigation.js

@@ -1,215 +0,0 @@
-var _excluded = ["url", "src", "title", "icon", "aria-current", "aria-label"],
-  _excluded2 = ["fullWidth", "generateLink", "items", "itemsRight", "leftNavProps", "logo", "navProps", "rightNavProps", "searchProps", "theme"];
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
-function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
-function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], t.indexOf(o) >= 0 || {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
-function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (e.indexOf(n) >= 0) continue; t[n] = r[n]; } return t; }
-import { useRef, useEffect } from "react";
-import React, { isValidElement, useState } from "react";
-import classNames from "classnames";
-import NavigationLink from "./NavigationLink";
-import NavigationMenu from "./NavigationMenu";
-import SearchBox from "../SearchBox";
-import { useOnEscapePressed } from "../../hooks";
-import { Theme } from "../../enums";
-/**
- * Narrow the type of the nav item to a NavMenu.
- */
-var isMenu = item => "items" in item;
-
-/**
- * Narrow the type of the logo prop to LogoProps.
- */
-var isLogoProps = logo => ! /*#__PURE__*/isValidElement(logo);
-
-/**
- * Display the standard logo if the props were provided otherwise display the
- * full element provided.
- */
-var generateLogo = (logo, generateLink) => {
-  if (isLogoProps(logo)) {
-    var {
-        url,
-        src,
-        title,
-        icon,
-        "aria-current": ariaCurrent,
-        "aria-label": ariaLabel
-      } = logo,
-      logoProps = _objectWithoutProperties(logo, _excluded);
-    var content = /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
-      className: "p-navigation__logo-tag"
-    }, icon !== null && icon !== void 0 ? icon : /*#__PURE__*/React.createElement("img", {
-      className: "p-navigation__logo-icon",
-      src: src,
-      alt: "Logo"
-    })), /*#__PURE__*/React.createElement("span", {
-      className: "p-navigation__logo-title"
-    }, title));
-    return /*#__PURE__*/React.createElement("div", _extends({
-      className: "p-navigation__tagged-logo"
-    }, logoProps), /*#__PURE__*/React.createElement(NavigationLink, {
-      generateLink: generateLink,
-      link: {
-        "aria-label": ariaLabel,
-        className: "p-navigation__link",
-        isSelected: !!ariaCurrent,
-        label: content,
-        url: url
-      }
-    }));
-  }
-  return /*#__PURE__*/React.createElement("div", {
-    className: "p-navigation__logo"
-  }, logo);
-};
-
-/**
- * Generate the JSX for a set of nav items. This will map the items to menus,
- * links or generated components.
- * @param items The nav items to map to elements.
- * @param closeMobileMenu A function to close the mobile menu.
- * @param generateLink The optional function used to generate link components.
- * @returns A list of navigation item elements.
- */
-var generateItems = (items, closeMobileMenu, generateLink) => items.map((item, i) => isMenu(item) ? /*#__PURE__*/React.createElement(NavigationMenu, _extends({}, item, {
-  generateLink: generateLink,
-  key: i
-})) : /*#__PURE__*/React.createElement("li", {
-  className: classNames("p-navigation__item", {
-    "is-selected": item.isSelected
-  }),
-  key: i
-}, /*#__PURE__*/React.createElement(NavigationLink, {
-  generateLink: generateLink,
-  link: _objectSpread(_objectSpread({}, item), {}, {
-    className: classNames("p-navigation__link", item.className),
-    onClick: evt => {
-      var _item$onClick;
-      (_item$onClick = item.onClick) === null || _item$onClick === void 0 || _item$onClick.call(item, evt);
-      closeMobileMenu();
-    }
-  })
-})));
-
-/**
-This is the [React](https://reactjs.org/) component for the Vanilla
-[Navigation](https://vanillaframework.io/docs/patterns/navigation) pattern. It
-is a simple navigation bar that you can add to the top of your site or app.
-
-The navigation items are collapsed behind a "Menu" link in small screens and
-displayed horizontally on larger screens.
- */
-var Navigation = _ref => {
-  var {
-      fullWidth,
-      generateLink,
-      items,
-      itemsRight,
-      leftNavProps,
-      logo,
-      navProps,
-      rightNavProps,
-      searchProps,
-      theme
-    } = _ref,
-    headerProps = _objectWithoutProperties(_ref, _excluded2);
-  var searchRef = useRef();
-  var [mobileMenuOpen, setMobileMenuOpen] = useState(false);
-  var [searchOpen, setSearchOpen] = useState(false);
-  // Display the search box if the props have been provided.
-  var hasSearch = !!searchProps;
-  // Close the mobile menu when the search box is opened.
-  var toggleSearch = open => {
-    setSearchOpen(open !== null && open !== void 0 ? open : !searchOpen);
-    setMobileMenuOpen(false);
-  };
-  // Close the search box when the mobile menu is opened.
-  var toggleMobileMenu = () => {
-    setMobileMenuOpen(!mobileMenuOpen);
-    setSearchOpen(false);
-  };
-  var closeMobileMenu = () => {
-    if (mobileMenuOpen) {
-      setMobileMenuOpen(false);
-    }
-  };
-  // Hide the searchbox when the escape key is pressed.
-  useOnEscapePressed(() => toggleSearch(false));
-  useEffect(() => {
-    if (searchOpen) {
-      var _searchRef$current;
-      // Focus on the searchbox when it appears. This done in a useEffect so
-      // that the state change to display the searchbox has already occured and
-      // the input has been made visible.
-      (_searchRef$current = searchRef.current) === null || _searchRef$current === void 0 || _searchRef$current.focus();
-    }
-  }, [searchOpen]);
-  return /*#__PURE__*/React.createElement("header", _extends({}, headerProps, {
-    className: classNames("p-navigation", headerProps.className, {
-      "has-menu-open": mobileMenuOpen,
-      "has-search-open": searchOpen,
-      "is-dark": theme === Theme.DARK,
-      "is-light": theme === Theme.LIGHT
-    })
-  }), /*#__PURE__*/React.createElement("div", {
-    className: fullWidth ? "p-navigation__row--full-width" : "p-navigation__row"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "p-navigation__banner"
-  }, generateLogo(logo, generateLink), /*#__PURE__*/React.createElement("ul", {
-    className: "p-navigation__items"
-  },
-  // When the header has a search box then this button is used to
-  // toggle the search box at mobile size.
-  hasSearch ? /*#__PURE__*/React.createElement("li", {
-    className: "p-navigation__item"
-  }, /*#__PURE__*/React.createElement("button", {
-    "aria-label": "Search",
-    className: "p-navigation__link--search-toggle",
-    onClick: () => toggleSearch()
-  }, /*#__PURE__*/React.createElement("span", {
-    className: "p-navigation__search-label"
-  }, "Search"))) : null, (items === null || items === void 0 ? void 0 : items.length) > 0 || (itemsRight === null || itemsRight === void 0 ? void 0 : itemsRight.length) > 0 ? /*#__PURE__*/React.createElement("li", {
-    className: "p-navigation__item"
-  }, /*#__PURE__*/React.createElement("button", {
-    "aria-pressed": mobileMenuOpen,
-    className: "p-navigation__link",
-    onClick: toggleMobileMenu
-  }, mobileMenuOpen ? "Close menu" : "Menu")) : null)), /*#__PURE__*/React.createElement("nav", _extends({
-    className: "p-navigation__nav"
-  }, navProps), /*#__PURE__*/React.createElement("ul", _extends({
-    className: "p-navigation__items"
-  }, leftNavProps), items ? generateItems(items, closeMobileMenu, generateLink) : null), itemsRight || hasSearch ? /*#__PURE__*/React.createElement("ul", _extends({
-    className: "p-navigation__items"
-  }, rightNavProps), itemsRight ? generateItems(itemsRight, closeMobileMenu, generateLink) : null,
-  // When the header has a search box then this button is used to
-  // toggle the search box at non-mobile size.
-  hasSearch ? /*#__PURE__*/React.createElement("li", {
-    className: "p-navigation__item"
-  }, /*#__PURE__*/React.createElement("button", {
-    "aria-label": "Search",
-    className: "p-navigation__link--search-toggle",
-    onClick: () => toggleSearch()
-  }, /*#__PURE__*/React.createElement("span", {
-    className: "p-navigation__search-label"
-  }, "Search"))) : null) : null,
-  // When the header has a search box and the user has opened the search
-  // form then this search box is displayed.
-  hasSearch ? /*#__PURE__*/React.createElement("div", {
-    className: "p-navigation__search",
-    "aria-hidden": !searchOpen
-  }, /*#__PURE__*/React.createElement(SearchBox, {
-    ref: searchRef
-  })) : null)),
-  // When the header has a search box and the user has opened the search
-  // form then this element is overlayed over the whole page.
-  hasSearch ? /*#__PURE__*/React.createElement("div", {
-    className: "p-navigation__search-overlay",
-    onClick: () => setSearchOpen(false)
-  }) : null);
-};
-export default Navigation;

package/dist-esm/components/Navigation/NavigationLink/NavigationLink.js

@@ -1,58 +0,0 @@
-import _pt from "prop-types";
-var _excluded = ["isSelected"],
-  _excluded2 = ["isSelected", "label", "url"],
-  _excluded3 = ["isSelected", "label", "url"];
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
-function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
-function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
-function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], t.indexOf(o) >= 0 || {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
-function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (e.indexOf(n) >= 0) continue; t[n] = r[n]; } return t; }
-import React from "react";
-import { isNavigationAnchor, isNavigationButton } from "../../../utils";
-/**
- * This component is used internally to display links inside the Navigation component.
- */
-var NavigationLink = _ref => {
-  var {
-    generateLink,
-    link
-  } = _ref;
-  // const ariaCurrent = isSelected ? "page" : undefined;
-  if (generateLink) {
-    var {
-        isSelected
-      } = link,
-      linkProps = _objectWithoutProperties(link, _excluded);
-    // If a function has been provided then use it to generate the link element.
-    return /*#__PURE__*/React.createElement(React.Fragment, null, generateLink(_objectSpread({
-      isSelected,
-      "aria-current": isSelected ? "page" : undefined
-    }, linkProps)));
-  } else if (isNavigationAnchor(link)) {
-    var {
-        isSelected: _isSelected,
-        label,
-        url
-      } = link,
-      linkProps = _objectWithoutProperties(link, _excluded2);
-    return /*#__PURE__*/React.createElement("a", _extends({}, linkProps, {
-      href: url,
-      "aria-current": _isSelected ? "page" : undefined
-    }), label);
-  } else if (isNavigationButton(link)) {
-    var {
-        isSelected: _isSelected2,
-        label: _label,
-        url: _url
-      } = link,
-      linkProps = _objectWithoutProperties(link, _excluded3);
-    return /*#__PURE__*/React.createElement("button", _extends({}, linkProps, {
-      "aria-current": _isSelected2 ? "page" : undefined
-    }), _label);
-  }
-  return null;
-};
-export default NavigationLink;

package/dist-esm/components/Navigation/NavigationLink/index.js

@@ -1 +0,0 @@
-export { default } from "./NavigationLink";

package/dist-esm/components/Navigation/NavigationMenu/NavigationMenu.js

@@ -1,57 +0,0 @@
-var _excluded = ["alignRight", "generateLink", "items", "label"];
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
-function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
-function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
-function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], t.indexOf(o) >= 0 || {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
-function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (e.indexOf(n) >= 0) continue; t[n] = r[n]; } return t; }
-import React, { useCallback, useId, useRef, useState } from "react";
-import classNames from "classnames";
-import NavigationLink from "../NavigationLink";
-import { useOnClickOutside } from "../../../hooks";
-/**
- * This component is used internally to display menus inside the Navigation component.
- */
-var NavigationMenu = _ref => {
-  var {
-      alignRight,
-      generateLink,
-      items,
-      label
-    } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded);
-  var [isOpen, setIsOpen] = useState(false);
-  var closeMenu = useCallback(() => setIsOpen(false), [setIsOpen]);
-  var menuRef = useRef(null);
-  useOnClickOutside(menuRef, closeMenu);
-  var menuId = useId();
-  return /*#__PURE__*/React.createElement("li", _extends({}, props, {
-    className: classNames(props.className, "p-navigation__item--dropdown-toggle", {
-      "is-active": isOpen
-    }),
-    ref: menuRef
-  }), /*#__PURE__*/React.createElement("button", {
-    "aria-controls": menuId,
-    className: "p-navigation__link u-no-margin--right",
-    onClick: evt => {
-      evt.preventDefault();
-      setIsOpen(!isOpen);
-    }
-  }, label), /*#__PURE__*/React.createElement("ul", {
-    "aria-hidden": !isOpen,
-    className: classNames("p-navigation__dropdown", {
-      "p-navigation__dropdown--right": alignRight
-    }),
-    id: menuId
-  }, items.map((item, i) => /*#__PURE__*/React.createElement("li", {
-    key: i
-  }, /*#__PURE__*/React.createElement(NavigationLink, {
-    generateLink: generateLink,
-    link: _objectSpread(_objectSpread({}, item), {}, {
-      className: classNames("p-navigation__dropdown-item", item.className)
-    })
-  })))));
-};
-export default NavigationMenu;

package/dist-esm/components/Navigation/NavigationMenu/index.js

@@ -1 +0,0 @@
-export { default } from "./NavigationMenu";

package/dist-esm/components/Navigation/index.js

@@ -1 +0,0 @@
-export { default } from "./Navigation";

package/dist-esm/components/Navigation/types.js

@@ -1 +0,0 @@
-export {};