@canonical/react-components 1.3.1 → 1.3.2

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

@@ -1,22 +0,0 @@
-var _excluded = ["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 _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 CheckableInput from "../CheckboxInput/CheckableInput";
-/**
- * This is a [React](https://reactjs.org/) component for the Vanilla [Radio input](https://docs.vanillaframework.io/base/forms#radio-button).
- *
- * Use radio buttons to select one of the given set of options.
- */
-var RadioInput = _ref => {
-  var {
-      label
-    } = _ref,
-    radioProps = _objectWithoutProperties(_ref, _excluded);
-  return /*#__PURE__*/React.createElement(CheckableInput, _extends({
-    inputType: "radio",
-    label: label
-  }, radioProps));
-};
-export default RadioInput;

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

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

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

@@ -1,22 +0,0 @@
-var _excluded = ["children", "className"];
-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 classNames from "classnames";
-import React from "react";
-/**
- * This is a [React](https://reactjs.org/) component for use within the Vanilla [Grid](https://docs.vanillaframework.io/patterns/grid/).
- *
- * Vanilla has a responsive grid using a combination of rows and columns.
- */
-var Row = _ref => {
-  var {
-      children,
-      className
-    } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded);
-  return /*#__PURE__*/React.createElement("div", _extends({
-    className: classNames(className, "row")
-  }, props), children);
-};
-export default Row;

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

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

package/dist-esm/components/SearchAndFilter/FilterPanelSection/FilterPanelSection.js

@@ -1,107 +0,0 @@
-import _pt from "prop-types";
-import React, { useEffect, useRef, useState } from "react";
-import Chip from "../../Chip";
-import { overflowingChipsCount, isChipInArray } from "../utils";
-import { highlightSubString } from "../../../utils";
-var FilterPanelSection = _ref => {
-  var {
-    data,
-    searchData,
-    searchTerm = "",
-    sectionHidden,
-    toggleSelected
-  } = _ref;
-  var {
-    chips,
-    heading
-  } = data;
-  var [overflowCounter, setOverflowCounter] = useState(0);
-  var [expanded, setExpanded] = useState(false);
-  var chipWrapper = useRef(null);
-  var handleChipClick = chip => {
-    toggleSelected(chip);
-  };
-
-  // If the offsetTop is more than double height of a single chip, consider it
-  // overflowing
-  var updateFlowCount = function updateFlowCount() {
-    var _chipWrapper$current;
-    var chips = chipWrapper === null || chipWrapper === void 0 || (_chipWrapper$current = chipWrapper.current) === null || _chipWrapper$current === void 0 ? void 0 : _chipWrapper$current.querySelectorAll(".p-chip");
-    var overflowCount = overflowingChipsCount(chips, 2);
-    setOverflowCounter(overflowCount);
-  };
-
-  // Check if search term characters matches any characters in panel heading
-  var searchTermInHeading = highlightSubString(heading, searchTerm).match;
-
-  // Serialise chip values into string so it can be interrogated with subString
-  var chipValues = [];
-  Object.entries(chips).forEach(chipValue => {
-    chipValues.push(chipValue[1].value);
-  });
-
-  // Search chips for character match with search term
-  var searchTermInChips = highlightSubString(chipValues.toString(), searchTerm).match;
-  var panelSectionVisible = searchTermInHeading || searchTermInChips || searchTerm === "";
-
-  // Update overflow count when component is resized
-  useEffect(() => {
-    var resizeObserverSupported = typeof ResizeObserver !== "undefined";
-    var wrapper = chipWrapper === null || chipWrapper === void 0 ? void 0 : chipWrapper.current;
-    var wrapperWidthObserver;
-    if (resizeObserverSupported && panelSectionVisible) {
-      wrapperWidthObserver = new ResizeObserver(() => {
-        updateFlowCount();
-      });
-      wrapperWidthObserver.observe(wrapper);
-    } else {
-      updateFlowCount();
-    }
-    return () => {
-      var _wrapperWidthObserver;
-      resizeObserverSupported && ((_wrapperWidthObserver = wrapperWidthObserver) === null || _wrapperWidthObserver === void 0 ? void 0 : _wrapperWidthObserver.disconnect());
-    };
-  }, [panelSectionVisible]);
-
-  // When overflow counter is clicked, all chips are shown
-  var showAllChips = () => {
-    setExpanded(true);
-  };
-  return /*#__PURE__*/React.createElement(React.Fragment, null, panelSectionVisible && /*#__PURE__*/React.createElement("div", {
-    className: "p-filter-panel-section"
-  }, heading && chips.length > 0 && /*#__PURE__*/React.createElement("h3", {
-    className: "p-filter-panel-section__heading",
-    dangerouslySetInnerHTML: {
-      __html: highlightSubString(heading, searchTerm).text
-    }
-  }), /*#__PURE__*/React.createElement("div", {
-    className: "p-filter-panel-section__chips",
-    "aria-expanded": expanded,
-    ref: chipWrapper
-  }, chips === null || chips === void 0 ? void 0 : chips.map(chip => {
-    // If search term has been added to input, only matching chips
-    // should display
-    var searchTermInChip = highlightSubString(chip.value, searchTerm).match;
-    var chipVisible = searchTermInChip || searchTerm === "" || highlightSubString(heading, searchTerm).match;
-    return chipVisible && !sectionHidden && /*#__PURE__*/React.createElement(Chip, {
-      key: "".concat(chip.lead, "+").concat(chip.value),
-      lead: chip.lead,
-      value: chip.value,
-      selected: isChipInArray(chip, searchData),
-      subString: searchTerm,
-      onClick: () => handleChipClick(chip)
-    });
-  }), overflowCounter > 0 && !expanded && /*#__PURE__*/React.createElement("span", {
-    className: "p-filter-panel-section__counter",
-    onClick: showAllChips,
-    onKeyPress: showAllChips,
-    tabIndex: 0
-  }, "+", overflowCounter))));
-};
-FilterPanelSection.propTypes = {
-  searchData: _pt.array.isRequired,
-  searchTerm: _pt.string.isRequired,
-  sectionHidden: _pt.bool,
-  toggleSelected: _pt.func.isRequired
-};
-export default FilterPanelSection;

package/dist-esm/components/SearchAndFilter/FilterPanelSection/index.js

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

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

@@ -1,286 +0,0 @@
-import _pt from "prop-types";
-var _excluded = ["existingSearchData", "filterPanelData", "returnSearchData", "onPanelToggle", "onExpandChange"];
-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, { useState, useEffect, useRef } from "react";
-import FilterPanelSection from "./FilterPanelSection";
-import Chip from "../Chip";
-import { overflowingChipsCount, isChipInArray } from "./utils";
-import { useOnEscapePressed, useWindowFitment } from "../../hooks";
-export var Label = /*#__PURE__*/function (Label) {
-  Label["AddFilter"] = "Add filter";
-  Label["Clear"] = "Clear input";
-  Label["SearchAndFilter"] = "Search and filter";
-  return Label;
-}({});
-/**
- * This component allows searching and filtering of large datasets.
- */
-var SearchAndFilter = _ref => {
-  var {
-      existingSearchData = [],
-      filterPanelData,
-      returnSearchData,
-      onPanelToggle = () => {},
-      onExpandChange = () => {}
-    } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded);
-  var [searchData, setSearchData] = useState(existingSearchData);
-  var [searchTerm, setSearchTerm] = useState("");
-  var [filterPanelHidden, setFilterPanelHidden] = useState(true);
-  var [searchBoxExpanded, setSearchBoxExpanded] = useState(false);
-  var [overflowSearchTermCounter, setOverflowSearchTermCounter] = useState(0);
-  var [searchContainerActive, setSearchContainerActive] = useState(false);
-  var [maxHeight, setMaxHeight] = useState();
-  var searchAndFilterRef = useRef(null);
-  var searchContainerRef = useRef(null);
-  var searchBoxRef = useRef(null);
-  var panel = useRef();
-
-  // Call onPanelToggle when the filterPanelHidden state changes
-  useEffect(onPanelToggle, [onPanelToggle, filterPanelHidden]);
-
-  // Call onExpandChange when the search box is expanded or collapsed
-  useEffect(onExpandChange, [onExpandChange, searchBoxExpanded]);
-
-  // Return searchData to parent component
-  useEffect(() => {
-    var mounted = true;
-    returnSearchData && mounted && returnSearchData(searchData);
-    return () => {
-      mounted = false;
-    };
-  }, [searchData, returnSearchData]);
-  var searchOnChange = searchTerm => {
-    setSearchTerm(searchTerm);
-  };
-
-  // Hide manual input form field when search container is inactive
-  useEffect(() => {
-    var searchContainerClickCheck = e => {
-      var _e$target;
-      var clickInContainer = ((_e$target = e.target) === null || _e$target === void 0 ? void 0 : _e$target.closest(".p-search-and-filter")) !== null;
-      setSearchContainerActive(clickInContainer);
-    };
-    document.addEventListener("click", searchContainerClickCheck);
-    return () => {
-      document.removeEventListener("click", searchContainerClickCheck);
-    };
-  }, [searchContainerActive]);
-  var closePanel = () => {
-    setFilterPanelHidden(true);
-  };
-  useOnEscapePressed(() => closePanel());
-
-  // This useEffect sets up listeners so the panel will close if user clicks
-  // anywhere else on the page or hits the escape key
-  useEffect(() => {
-    var mouseDown = e => {
-      var _searchAndFilterRef$c;
-      // Check if click is outside of filter panel
-      if (!(searchAndFilterRef !== null && searchAndFilterRef !== void 0 && (_searchAndFilterRef$c = searchAndFilterRef.current) !== null && _searchAndFilterRef$c !== void 0 && _searchAndFilterRef$c.contains(e.target))) {
-        // If so, close the panel
-        closePanel();
-      }
-    };
-
-    // Add listener on document to capture click events
-    document.addEventListener("mousedown", mouseDown);
-    // return function to be called when unmounted
-    return () => {
-      document.removeEventListener("mousedown", mouseDown);
-    };
-  }, []);
-
-  // Add passed chip to the searchData array
-  var toggleSelected = chip => {
-    var currentSelected = [...searchData];
-    if (!isChipInArray(chip, currentSelected)) {
-      currentSelected.push(chip);
-      setSearchData(currentSelected);
-      setSearchTerm("");
-    } else {
-      var updatedCurrentSelected = currentSelected.filter(currentSelectedChip => {
-        return currentSelectedChip.value !== chip.value;
-      });
-      setSearchData(updatedCurrentSelected);
-    }
-  };
-
-  // Remove passed chip from the searchData array
-  var removeFromSelected = chip => {
-    if (searchData.includes(chip)) {
-      var updatedSelected = searchData.filter(searchDataChip => searchDataChip !== chip);
-      setSearchData(updatedSelected);
-    }
-  };
-
-  // When overflow chips are shown, clicking anywhere outside search area
-  // or clicking on a chip should hide them again
-  useEffect(() => {
-    var hideOverflowChips = e => {
-      if (!e.target.closest(".p-search-and-filter") && e.target.className !== "p-icon--close") {
-        setSearchBoxExpanded(false);
-      }
-    };
-    document.addEventListener("click", e => {
-      hideOverflowChips(e);
-    });
-    return () => {
-      document.removeEventListener("click", e => {
-        hideOverflowChips(e);
-      });
-    };
-  }, []);
-  var handleSubmit = () => {
-    if (searchTerm.trim() !== "") {
-      toggleSelected({
-        value: searchTerm,
-        quoteValue: true
-      });
-      setSearchTerm("");
-    }
-  };
-
-  // If the offsetTop is more than double height of a single chip, consider it
-  // overflowing
-  var updateFlowCount = function updateFlowCount() {
-    var _searchContainerRef$c;
-    var chips = searchContainerRef === null || searchContainerRef === void 0 || (_searchContainerRef$c = searchContainerRef.current) === null || _searchContainerRef$c === void 0 ? void 0 : _searchContainerRef$c.querySelectorAll(".p-chip");
-    var overflowCount = overflowingChipsCount(chips, 1);
-    setOverflowSearchTermCounter(overflowCount);
-  };
-
-  // Watch for container resize and recalculate overflow count accordingly
-  useEffect(() => {
-    var resizeObserverSupported = typeof ResizeObserver !== "undefined";
-    var wrapper = searchContainerRef.current;
-    var wrapperWidthObserver;
-    if (resizeObserverSupported && wrapper) {
-      wrapperWidthObserver = new ResizeObserver(() => {
-        updateFlowCount();
-      });
-      wrapperWidthObserver.observe(wrapper);
-    } else {
-      updateFlowCount();
-    }
-    return () => {
-      var _wrapperWidthObserver;
-      resizeObserverSupported && ((_wrapperWidthObserver = wrapperWidthObserver) === null || _wrapperWidthObserver === void 0 ? void 0 : _wrapperWidthObserver.disconnect());
-    };
-  }, [searchData]);
-  useWindowFitment(panel.current, searchAndFilterRef.current, fitsWindow => setMaxHeight(fitsWindow.fromBottom.spaceBelow - 16), 0, !filterPanelHidden);
-
-  // Add search prompt value to search on Enter key
-  var searchPromptKeyDown = e => {
-    if (e.key === "Enter") {
-      handleSubmit();
-    }
-  };
-  var searchBox = searchBoxRef.current;
-  var searchContainer = searchContainerRef.current;
-  if (!searchBoxExpanded && searchBox && searchContainer && overflowSearchTermCounter === 0) {
-    if (searchBox.offsetTop > searchContainer.offsetHeight) {
-      setSearchBoxExpanded(true);
-    }
-  }
-
-  // If chips or input field contains values, clear 'em out
-  var clearAllSearchTerms = () => {
-    setSearchTerm("");
-  };
-  var placeholder = searchData.length ? Label.AddFilter : Label.SearchAndFilter;
-  return /*#__PURE__*/React.createElement("div", _extends({
-    className: "p-search-and-filter",
-    ref: searchAndFilterRef,
-    onClick: () => filterPanelHidden && setFilterPanelHidden(false)
-  }, props), /*#__PURE__*/React.createElement("div", {
-    className: "p-search-and-filter__search-container",
-    "aria-expanded": searchBoxExpanded,
-    "data-active": searchContainerActive || searchData.length === 0,
-    "data-empty": searchData.length <= 0,
-    ref: searchContainerRef
-  }, searchTerm !== "" && /*#__PURE__*/React.createElement("button", {
-    "aria-label": Label.Clear,
-    className: "p-search-and-filter__clear",
-    onClick: () => clearAllSearchTerms()
-  }, /*#__PURE__*/React.createElement("i", {
-    className: "p-icon--close"
-  })), Object.values(searchData).map(chip => {
-    return /*#__PURE__*/React.createElement(Chip, {
-      lead: chip.lead,
-      value: chip.value,
-      key: "search-".concat(chip.lead, "+").concat(chip.value),
-      onDismiss: event => {
-        // Prevent filter chip dismissals from bubbling up and triggering the parent onClick handler
-        event.stopPropagation();
-        removeFromSelected(chip);
-      },
-      selected: true,
-      quoteValue: chip.quoteValue
-    });
-  }), /*#__PURE__*/React.createElement("form", {
-    className: "p-search-and-filter__box",
-    onSubmit: e => {
-      e.preventDefault();
-      handleSubmit();
-    },
-    "data-overflowing": searchBoxExpanded,
-    ref: searchBoxRef
-  }, /*#__PURE__*/React.createElement("label", {
-    className: "u-off-screen",
-    htmlFor: "search-and-filter-input"
-  }, searchData.length ? Label.AddFilter : Label.SearchAndFilter), /*#__PURE__*/React.createElement("input", {
-    autoComplete: "off",
-    className: "p-search-and-filter__input",
-    id: "search-and-filter-input",
-    name: "search",
-    onChange: e => searchOnChange(e.target.value),
-    placeholder: placeholder,
-    type: "search",
-    value: searchTerm
-  }), /*#__PURE__*/React.createElement("button", {
-    className: "u-off-screen",
-    type: "submit"
-  }, "Search")), overflowSearchTermCounter > 0 && /*#__PURE__*/React.createElement("span", {
-    className: "p-search-and-filter__selected-count",
-    onClick: () => setSearchBoxExpanded(true),
-    onKeyDown: () => setSearchBoxExpanded(true),
-    role: "button",
-    tabIndex: 0
-  }, "+", overflowSearchTermCounter)), (filterPanelData.length > 0 || searchTerm.length > 0) && /*#__PURE__*/React.createElement("div", {
-    className: "p-search-and-filter__panel",
-    "aria-hidden": filterPanelHidden,
-    ref: panel,
-    style: {
-      maxHeight,
-      minHeight: "5rem",
-      overflowX: "auto"
-    }
-  }, /*#__PURE__*/React.createElement("div", null, searchTerm.length > 0 && /*#__PURE__*/React.createElement("div", {
-    className: "p-search-and-filter__search-prompt",
-    onClick: () => handleSubmit(),
-    onKeyDown: e => searchPromptKeyDown(e),
-    role: "button",
-    tabIndex: 0
-  }, "Search for", " ", /*#__PURE__*/React.createElement("span", {
-    className: "p-search-and-filter__search-query"
-  }, searchTerm), "..."), filterPanelData.map(filterPanelSectionData => {
-    return /*#__PURE__*/React.createElement(FilterPanelSection, {
-      key: filterPanelSectionData.id,
-      data: filterPanelSectionData,
-      toggleSelected: toggleSelected,
-      searchData: searchData,
-      searchTerm: searchTerm
-    });
-  }))));
-};
-SearchAndFilter.propTypes = {
-  existingSearchData: _pt.array,
-  filterPanelData: _pt.array.isRequired,
-  returnSearchData: _pt.func.isRequired,
-  onPanelToggle: _pt.func,
-  onExpandChange: _pt.func
-};
-export default SearchAndFilter;

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

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

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

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

package/dist-esm/components/SearchAndFilter/utils.js

@@ -1,22 +0,0 @@
-/**
- * Return number of overflowing chips given a row threshold
- * @param {array} chips - An array of chips
- * @param {Integer} overflowRowLimit - Number of rows to show before counting
- * overflow
- */
-export var overflowingChipsCount = (chips, overflowRowLimit) => {
-  var overflowChips = 0;
-  if (chips) {
-    chips.forEach(chip => {
-      if (chip.offsetTop > chip.offsetHeight * overflowRowLimit) overflowChips++;
-    });
-  }
-  return overflowChips;
-};
-
-/**
- * Check if supplied chip object already exists in searchData prop
- * @param {Object} chip - A chip object {lead: 'foo', value: 'bar'}
- * @param {Array} existingArr - An array of chip objects
- */
-export var isChipInArray = (chip, existingArr) => existingArr === null || existingArr === void 0 ? void 0 : existingArr.some(searchDataItem => searchDataItem.lead === chip.lead && searchDataItem.value === chip.value);

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

@@ -1,95 +0,0 @@
-var _excluded = ["autocomplete", "className", "disabled", "externallyControlled", "onChange", "onSearch", "onClear", "placeholder", "shouldBlurOnSearch", "shouldRefocusAfterReset", "value"];
-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 classNames from "classnames";
-import React, { useRef } from "react";
-import Icon from "../Icon";
-export var Label = /*#__PURE__*/function (Label) {
-  Label["Clear"] = "Clear search field";
-  Label["Search"] = "Search";
-  return Label;
-}({});
-/**
- * This is a [React](https://reactjs.org/) component for the Vanilla [SearchBox](https://docs.vanillaframework.io/patterns/search-box/).
- *
- * Search boxes enable search functionality on a page and are typically used in a navigation bar. SearchBox elements should be wrapped within a form element that handles its own submit action.
- */
-var SearchBox = /*#__PURE__*/React.forwardRef((_ref, forwardedRef) => {
-  var {
-      autocomplete = "on",
-      className,
-      disabled,
-      externallyControlled,
-      onChange: _onChange,
-      onSearch,
-      onClear,
-      placeholder = "Search",
-      shouldBlurOnSearch = true,
-      shouldRefocusAfterReset,
-      value
-    } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded);
-  var internalRef = useRef();
-  var resetInput = () => {
-    _onChange === null || _onChange === void 0 || _onChange("");
-    onClear === null || onClear === void 0 || onClear();
-    if (internalRef.current) {
-      internalRef.current.value = "";
-      if (shouldRefocusAfterReset) internalRef.current.focus();
-    }
-  };
-  var triggerSearch = () => {
-    onSearch === null || onSearch === void 0 || onSearch(externallyControlled ? value : internalRef.current.value);
-  };
-  var onKeyDown = e => {
-    if (e.key === "Enter" && internalRef.current.checkValidity()) {
-      if (shouldBlurOnSearch) {
-        internalRef.current.blur();
-      }
-      triggerSearch();
-    }
-  };
-  return /*#__PURE__*/React.createElement("div", {
-    className: classNames("p-search-box", className)
-  }, /*#__PURE__*/React.createElement("label", {
-    className: "u-off-screen",
-    htmlFor: "search"
-  }, placeholder || "Search"), /*#__PURE__*/React.createElement("input", _extends({
-    autoComplete: autocomplete,
-    className: "p-search-box__input",
-    disabled: disabled,
-    id: "search",
-    name: "search",
-    onChange: evt => _onChange === null || _onChange === void 0 ? void 0 : _onChange(evt.target.value),
-    onKeyDown: onKeyDown,
-    placeholder: placeholder,
-    ref: input => {
-      internalRef.current = input;
-      // Handle both function and object refs.
-      if (typeof forwardedRef === "function") {
-        forwardedRef(input);
-      } else if (forwardedRef) {
-        forwardedRef.current = input;
-      }
-    },
-    type: "search",
-    defaultValue: externallyControlled ? undefined : value,
-    value: externallyControlled ? value : undefined
-  }, props)), value && /*#__PURE__*/React.createElement("button", {
-    className: "p-search-box__reset",
-    disabled: disabled,
-    onClick: resetInput,
-    type: "reset"
-  }, /*#__PURE__*/React.createElement(Icon, {
-    name: "close"
-  }, Label.Clear)), /*#__PURE__*/React.createElement("button", {
-    className: "p-search-box__button",
-    disabled: disabled,
-    onClick: triggerSearch
-  }, /*#__PURE__*/React.createElement(Icon, {
-    name: "search"
-  }, Label.Search)));
-});
-SearchBox.displayName = "SearchBox";
-export default SearchBox;

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

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

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

@@ -1,84 +0,0 @@
-var _excluded = ["label", "value"],
-  _excluded2 = ["caution", "className", "error", "help", "id", "label", "labelClassName", "onChange", "options", "required", "stacked", "success", "takeFocus", "wrapperClassName"];
-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 classNames from "classnames";
-import React, { useEffect, useId, useRef } from "react";
-import Field from "../Field";
-
-/**
- * The props for the Select component.
- */
-
-var generateOptions = options => options === null || options === void 0 ? void 0 : options.map(_ref => {
-  var {
-      label,
-      value
-    } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded);
-  return /*#__PURE__*/React.createElement("option", _extends({
-    value: value,
-    key: "".concat(value) || label
-  }, props), label);
-});
-
-/**
- * This is a [React](https://reactjs.org/) component for the Vanilla [Select](https://docs.vanillaframework.io/base/forms/#select).
- *
- * Use the Select component to create a drop-down list.
- */
-var Select = _ref2 => {
-  var {
-      caution,
-      className,
-      error,
-      help,
-      id,
-      label,
-      labelClassName,
-      onChange: _onChange,
-      options,
-      required,
-      stacked,
-      success,
-      takeFocus,
-      wrapperClassName
-    } = _ref2,
-    selectProps = _objectWithoutProperties(_ref2, _excluded2);
-  var selectRef = useRef(null);
-  var validationId = useId();
-  var defaultSelectId = useId();
-  var selectId = id || defaultSelectId;
-  var helpId = useId();
-  var hasError = !!error;
-  useEffect(() => {
-    if (takeFocus) {
-      selectRef.current.focus();
-    }
-  }, [takeFocus]);
-  return /*#__PURE__*/React.createElement(Field, {
-    caution: caution,
-    className: wrapperClassName,
-    error: error,
-    forId: selectId,
-    help: help,
-    helpId: helpId,
-    isSelect: true,
-    label: label,
-    labelClassName: labelClassName,
-    required: required,
-    stacked: stacked,
-    success: success,
-    validationId: validationId
-  }, /*#__PURE__*/React.createElement("select", _extends({
-    "aria-describedby": [help ? helpId : null, success ? validationId : null].filter(Boolean).join(" "),
-    "aria-errormessage": hasError ? validationId : null,
-    "aria-invalid": hasError,
-    className: classNames("p-form-validation__input", className),
-    id: selectId,
-    onChange: evt => _onChange && _onChange(evt),
-    ref: selectRef
-  }, selectProps), generateOptions(options)));
-};
-export default Select;

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

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