@carbon/ibm-products 2.65.0 → 2.66.0

package/es/components/AddSelect/AddSelectBody.js

@@ -5,7 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, defineProperty as _defineProperty, objectSpread2 as _objectSpread2, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import React__default, { forwardRef, useState } from 'react';
 import PropTypes from '../../_virtual/index.js';
 import cx from 'classnames';
@@ -23,7 +23,7 @@ import '../EmptyStates/UnauthorizedEmptyState/UnauthorizedEmptyState.js';
 import { AddSelectSidebar } from './AddSelectSidebar.js';
 import { AddSelectBreadcrumbs } from './AddSelectBreadcrumbs.js';
 import { AddSelectList } from './AddSelectList.js';
-import { AddSelectColumn as _AddSelectColumn } from './AddSelectColumn.js';
+import { AddSelectColumn } from './AddSelectColumn.js';
 import { AddSelectFilter } from './AddSelectFilter.js';
 import { AddSelectSort } from './AddSelectSort.js';
 import { getFilteredItems, sortItems } from './add-select-utils.js';
@@ -32,90 +32,75 @@ import useParentSelect from './hooks/useParentSelect.js';
 import usePath from './hooks/usePath.js';
 import { pkg } from '../../settings.js';
 
-var _excluded = ["className", "clearFiltersText", "closeIconDescription", "columnInputPlaceholder", "defaultModifiers", "description", "filterByLabel", "globalFilterOpts", "globalFiltersLabel", "globalFiltersIconDescription", "globalFiltersPlaceholderText", "globalFiltersPrimaryButtonText", "globalFiltersSecondaryButtonText", "globalSearchLabel", "globalSearchPlaceholder", "globalSortBy", "illustrationTheme", "influencerTitle", "items", "itemsLabel", "metaIconDescription", "metaPanelTitle", "multi", "navIconDescription", "noResultsDescription", "noResultsTitle", "noSelectionDescription", "noSelectionTitle", "normalizedItems", "onClose", "onCloseButtonText", "onSubmit", "onSubmitButtonText", "open", "portalTarget", "searchResultsTitle", "sortByLabel", "title", "useNormalizedItems"];
-var blockClass = "".concat(pkg.prefix, "--add-select");
-var componentName = 'AddSelectBody';
-var AddSelectBody = /*#__PURE__*/forwardRef(function (_ref, ref) {
-  var _path$;
-  var className = _ref.className,
-    clearFiltersText = _ref.clearFiltersText,
-    closeIconDescription = _ref.closeIconDescription,
-    columnInputPlaceholder = _ref.columnInputPlaceholder,
-    defaultModifiers = _ref.defaultModifiers,
-    description = _ref.description,
-    filterByLabel = _ref.filterByLabel,
-    globalFilterOpts = _ref.globalFilterOpts,
-    globalFiltersLabel = _ref.globalFiltersLabel,
-    globalFiltersIconDescription = _ref.globalFiltersIconDescription,
-    globalFiltersPlaceholderText = _ref.globalFiltersPlaceholderText,
-    globalFiltersPrimaryButtonText = _ref.globalFiltersPrimaryButtonText,
-    globalFiltersSecondaryButtonText = _ref.globalFiltersSecondaryButtonText,
-    globalSearchLabel = _ref.globalSearchLabel,
-    globalSearchPlaceholder = _ref.globalSearchPlaceholder,
-    globalSortBy = _ref.globalSortBy,
-    illustrationTheme = _ref.illustrationTheme,
-    influencerTitle = _ref.influencerTitle,
-    items = _ref.items,
-    itemsLabel = _ref.itemsLabel,
-    metaIconDescription = _ref.metaIconDescription,
-    metaPanelTitle = _ref.metaPanelTitle,
-    multi = _ref.multi,
-    navIconDescription = _ref.navIconDescription,
-    noResultsDescription = _ref.noResultsDescription,
-    noResultsTitle = _ref.noResultsTitle,
-    noSelectionDescription = _ref.noSelectionDescription,
-    noSelectionTitle = _ref.noSelectionTitle,
-    normalizedItems = _ref.normalizedItems,
-    onClose = _ref.onClose,
-    onCloseButtonText = _ref.onCloseButtonText,
-    onSubmit = _ref.onSubmit,
-    onSubmitButtonText = _ref.onSubmitButtonText,
-    open = _ref.open,
-    portalTarget = _ref.portalTarget,
-    searchResultsTitle = _ref.searchResultsTitle,
-    sortByLabel = _ref.sortByLabel,
-    title = _ref.title,
-    useNormalizedItems = _ref.useNormalizedItems,
-    rest = _objectWithoutProperties(_ref, _excluded);
+const blockClass = `${pkg.prefix}--add-select`;
+const componentName = 'AddSelectBody';
+const AddSelectBody = /*#__PURE__*/forwardRef((_ref, ref) => {
+  let {
+    className,
+    clearFiltersText,
+    closeIconDescription,
+    columnInputPlaceholder,
+    defaultModifiers,
+    description,
+    filterByLabel,
+    globalFilterOpts,
+    globalFiltersLabel,
+    globalFiltersIconDescription,
+    globalFiltersPlaceholderText,
+    globalFiltersPrimaryButtonText,
+    globalFiltersSecondaryButtonText,
+    globalSearchLabel,
+    globalSearchPlaceholder,
+    globalSortBy,
+    illustrationTheme,
+    influencerTitle,
+    items,
+    itemsLabel,
+    metaIconDescription,
+    metaPanelTitle,
+    multi,
+    navIconDescription,
+    noResultsDescription,
+    noResultsTitle,
+    noSelectionDescription,
+    noSelectionTitle,
+    normalizedItems,
+    onClose,
+    onCloseButtonText,
+    onSubmit,
+    onSubmitButtonText,
+    open,
+    portalTarget,
+    searchResultsTitle,
+    sortByLabel,
+    title,
+    useNormalizedItems,
+    ...rest
+  } = _ref;
   // hooks
-  var _useState = useState(''),
-    _useState2 = _slicedToArray(_useState, 2),
-    singleSelection = _useState2[0],
-    setSingleSelection = _useState2[1];
-  var _useState3 = useState([]),
-    _useState4 = _slicedToArray(_useState3, 2),
-    multiSelection = _useState4[0],
-    setMultiSelection = _useState4[1];
-  var _useState5 = useState(''),
-    _useState6 = _slicedToArray(_useState5, 2),
-    searchTerm = _useState6[0],
-    setSearchTerm = _useState6[1];
-  var _useState7 = useState({}),
-    _useState8 = _slicedToArray(_useState7, 2),
-    appliedGlobalFilters = _useState8[0],
-    setAppliedGlobalFilters = _useState8[1];
-  var _useState9 = useState({}),
-    _useState10 = _slicedToArray(_useState9, 2),
-    displayMetalPanel = _useState10[0],
-    setDisplayMetaPanel = _useState10[1];
-  var _useState11 = useState(defaultModifiers),
-    _useState12 = _slicedToArray(_useState11, 2),
-    appliedModifiers = _useState12[0],
-    setAppliedModifiers = _useState12[1];
-  var _useItemSort = useItemSort(),
-    sortDirection = _useItemSort.sortDirection,
-    setSortDirection = _useItemSort.setSortDirection,
-    sortAttribute = _useItemSort.sortAttribute,
-    setSortAttribute = _useItemSort.setSortAttribute;
-  var _useParentSelect = useParentSelect(),
-    parentSelected = _useParentSelect.parentSelected,
-    setParentSelected = _useParentSelect.setParentSelected;
-  var _usePath = usePath(itemsLabel),
-    path = _usePath.path,
-    setPath = _usePath.setPath,
-    pathOnclick = _usePath.pathOnclick,
-    resetPath = _usePath.resetPath;
-  var resetState = function resetState() {
+  const [singleSelection, setSingleSelection] = useState('');
+  const [multiSelection, setMultiSelection] = useState([]);
+  const [searchTerm, setSearchTerm] = useState('');
+  const [appliedGlobalFilters, setAppliedGlobalFilters] = useState({});
+  const [displayMetalPanel, setDisplayMetaPanel] = useState({});
+  const [appliedModifiers, setAppliedModifiers] = useState(defaultModifiers);
+  const {
+    sortDirection,
+    setSortDirection,
+    sortAttribute,
+    setSortAttribute
+  } = useItemSort();
+  const {
+    parentSelected,
+    setParentSelected
+  } = useParentSelect();
+  const {
+    path,
+    setPath,
+    pathOnclick,
+    resetPath
+  } = usePath(itemsLabel);
+  const resetState = () => {
     setSingleSelection('');
     setMultiSelection([]);
     setSearchTerm('');
@@ -127,43 +112,44 @@ var AddSelectBody = /*#__PURE__*/forwardRef(function (_ref, ref) {
     setParentSelected(null);
     resetPath();
   };
-  var onCloseHandler = function onCloseHandler() {
+  const onCloseHandler = () => {
     resetState();
-    onClose === null || onClose === void 0 || onClose();
+    onClose?.();
   };
-  var tearsheetClassnames = cx(className, blockClass, _defineProperty(_defineProperty({}, "".concat(blockClass, "__single"), !multi), "".concat(blockClass, "__multi"), multi));
-  var globalFilterKeys = Object.keys(appliedGlobalFilters);
-  var globalFiltersApplied = globalFilterKeys.length > 0;
+  const tearsheetClassnames = cx(className, blockClass, {
+    [`${blockClass}__single`]: !multi,
+    [`${blockClass}__multi`]: multi
+  });
+  const globalFilterKeys = Object.keys(appliedGlobalFilters);
+  const globalFiltersApplied = globalFilterKeys.length > 0;
 
   // handlers
-  var handleSearch = function handleSearch(term) {
+  const handleSearch = term => {
     setSearchTerm(term);
   };
-  var handleFilter = function handleFilter(filters) {
+  const handleFilter = filters => {
     setAppliedGlobalFilters(filters);
   };
-  var submitHandler = function submitHandler() {
-    if (multi && appliedModifiers && (appliedModifiers === null || appliedModifiers === void 0 ? void 0 : appliedModifiers.length) > 0) {
-      var selections = multiSelection.map(function (item) {
-        return appliedModifiers.find(function (mod) {
-          return mod.id === item;
-        });
+  const submitHandler = () => {
+    if (multi && appliedModifiers && appliedModifiers?.length > 0) {
+      const selections = multiSelection.map(item => {
+        return appliedModifiers.find(mod => mod.id === item);
       });
-      onSubmit === null || onSubmit === void 0 || onSubmit(selections);
-    } else if (multi && (appliedModifiers === null || appliedModifiers === void 0 ? void 0 : appliedModifiers.length) === 0) {
-      onSubmit === null || onSubmit === void 0 || onSubmit(multiSelection);
+      onSubmit?.(selections);
+    } else if (multi && appliedModifiers?.length === 0) {
+      onSubmit?.(multiSelection);
     } else {
-      onSubmit === null || onSubmit === void 0 || onSubmit(singleSelection);
+      onSubmit?.(singleSelection);
     }
     onCloseHandler();
   };
-  var setShowBreadsCrumbs = function setShowBreadsCrumbs() {
+  const setShowBreadsCrumbs = () => {
     if (useNormalizedItems === false || searchTerm || globalFiltersApplied) {
       return false;
     }
     return true;
   };
-  var setShowTags = function setShowTags() {
+  const setShowTags = () => {
     if (searchTerm) {
       return true;
     }
@@ -172,35 +158,36 @@ var AddSelectBody = /*#__PURE__*/forwardRef(function (_ref, ref) {
     }
     return true;
   };
-  var parentSelectionHandler = function parentSelectionHandler(id, title, parentId) {
+  const parentSelectionHandler = (id, title, parentId) => {
     setParentSelected(id);
     setPath(id, title, parentId);
   };
-  var sortFn = sortItems(sortAttribute, sortDirection);
-  var itemsToDisplay = getFilteredItems(useNormalizedItems, normalizedItems, searchTerm, globalFiltersApplied, globalFilterKeys, appliedGlobalFilters, sortFn, multi, items, path);
-  var hasResults = itemsToDisplay.length > 0;
-  var showBreadsCrumbs = setShowBreadsCrumbs();
-  var showSort = (searchTerm || globalFiltersApplied) && hasResults;
-  var showTags = setShowTags();
-  var commonListProps = {
-    displayMetalPanel: displayMetalPanel,
-    metaIconDescription: metaIconDescription,
-    multi: multi,
-    multiSelection: multiSelection,
-    navIconDescription: navIconDescription,
-    path: path,
-    setMultiSelection: setMultiSelection,
-    setPath: setPath,
-    setSingleSelection: setSingleSelection,
-    singleSelection: singleSelection,
-    setDisplayMetaPanel: setDisplayMetaPanel,
+  const sortFn = sortItems(sortAttribute, sortDirection);
+  const itemsToDisplay = getFilteredItems(useNormalizedItems, normalizedItems, searchTerm, globalFiltersApplied, globalFilterKeys, appliedGlobalFilters, sortFn, multi, items, path);
+  const hasResults = itemsToDisplay.length > 0;
+  const showBreadsCrumbs = setShowBreadsCrumbs();
+  const showSort = (searchTerm || globalFiltersApplied) && hasResults;
+  const showTags = setShowTags();
+  const commonListProps = {
+    displayMetalPanel,
+    metaIconDescription,
+    multi,
+    multiSelection,
+    navIconDescription,
+    path,
+    setMultiSelection,
+    setPath,
+    setSingleSelection,
+    singleSelection,
+    setDisplayMetaPanel,
     parentId: path[0].id
   };
-  var commonTearsheetProps = _objectSpread2(_objectSpread2({}, rest), {}, {
+  const commonTearsheetProps = {
+    ...rest,
     className: tearsheetClassnames,
-    open: open,
-    title: title,
-    description: description,
+    open,
+    title,
+    description,
     actions: [{
       label: onCloseButtonText,
       kind: 'secondary',
@@ -211,29 +198,29 @@ var AddSelectBody = /*#__PURE__*/forwardRef(function (_ref, ref) {
       onClick: submitHandler,
       disabled: multi ? multiSelection.length === 0 : !singleSelection
     }],
-    portalTarget: portalTarget,
-    ref: ref
-  });
-  var sidebarProps = {
-    appliedModifiers: appliedModifiers,
-    closeIconDescription: closeIconDescription,
-    displayMetalPanel: displayMetalPanel,
-    illustrationTheme: illustrationTheme,
-    influencerTitle: influencerTitle,
-    items: useNormalizedItems ? normalizedItems : items === null || items === void 0 ? void 0 : items.entries,
-    metaPanelTitle: metaPanelTitle,
-    modifiers: items === null || items === void 0 ? void 0 : items.modifiers,
-    multiSelection: multiSelection,
-    noSelectionDescription: noSelectionDescription,
-    noSelectionTitle: noSelectionTitle,
-    setDisplayMetaPanel: setDisplayMetaPanel
+    portalTarget,
+    ref
+  };
+  const sidebarProps = {
+    appliedModifiers,
+    closeIconDescription,
+    displayMetalPanel,
+    illustrationTheme,
+    influencerTitle,
+    items: useNormalizedItems ? normalizedItems : items?.entries,
+    metaPanelTitle,
+    modifiers: items?.modifiers,
+    multiSelection,
+    noSelectionDescription,
+    noSelectionTitle,
+    setDisplayMetaPanel
   };
-  var displayColumnView = multi && useNormalizedItems && !searchTerm && !globalFiltersApplied;
+  const displayColumnView = multi && useNormalizedItems && !searchTerm && !globalFiltersApplied;
 
   // main content
-  var body = /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
+  const body = /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
     id: "add-select",
-    className: "".concat(blockClass, "__header")
+    className: `${blockClass}__header`
   }, /*#__PURE__*/React__default.createElement(AddSelectFilter, {
     inputLabel: globalSearchLabel,
     inputPlaceholder: globalSearchPlaceholder,
@@ -251,15 +238,17 @@ var AddSelectBody = /*#__PURE__*/forwardRef(function (_ref, ref) {
     hasFiltersApplied: globalFiltersApplied,
     clearFiltersText: clearFiltersText
   }), /*#__PURE__*/React__default.createElement("div", {
-    className: cx("".concat(blockClass, "__sub-header"), _defineProperty({}, "".concat(blockClass, "__sub-header-multi"), multi))
+    className: cx(`${blockClass}__sub-header`, {
+      [`${blockClass}__sub-header-multi`]: multi
+    })
   }, /*#__PURE__*/React__default.createElement("div", {
-    className: "".concat(blockClass, "__tags")
+    className: `${blockClass}__tags`
   }, showBreadsCrumbs ? /*#__PURE__*/React__default.createElement(AddSelectBreadcrumbs, {
     path: path,
     onClick: pathOnclick,
     multi: multi
   }) : /*#__PURE__*/React__default.createElement("p", {
-    className: "".concat(blockClass, "__tags-label")
+    className: `${blockClass}__tags-label`
   }, searchTerm ? searchResultsTitle : itemsLabel), showTags && /*#__PURE__*/React__default.createElement(Tag, {
     type: "gray",
     size: "sm"
@@ -268,23 +257,23 @@ var AddSelectBody = /*#__PURE__*/forwardRef(function (_ref, ref) {
     setSortDirection: setSortDirection,
     sortBy: globalSortBy
   }))), displayColumnView ? /*#__PURE__*/React__default.createElement("div", {
-    className: "".concat(blockClass, "__columns")
-  }, /*#__PURE__*/React__default.createElement(_AddSelectColumn, _extends({}, commonListProps, {
+    className: `${blockClass}__columns`
+  }, /*#__PURE__*/React__default.createElement(AddSelectColumn, _extends({}, commonListProps, {
     items: itemsToDisplay,
     columnInputPlaceholder: columnInputPlaceholder,
-    header: (_path$ = path[0]) === null || _path$ === void 0 ? void 0 : _path$.title,
+    header: path[0]?.title,
     filterByLabel: filterByLabel,
     sortByLabel: sortByLabel
   }))) : /*#__PURE__*/React__default.createElement("div", null, hasResults ? /*#__PURE__*/React__default.createElement(AddSelectList, _extends({}, commonListProps, {
     filteredItems: itemsToDisplay,
-    modifiers: items === null || items === void 0 ? void 0 : items.modifiers,
+    modifiers: items?.modifiers,
     appliedModifiers: appliedModifiers,
     setAppliedModifiers: setAppliedModifiers,
     setParentSelected: parentSelectionHandler,
     parentSelected: parentSelected,
     parentId: parentSelected || path[0].id
   })) : /*#__PURE__*/React__default.createElement("div", {
-    className: "".concat(blockClass, "__body")
+    className: `${blockClass}__body`
   }, /*#__PURE__*/React__default.createElement(NotFoundEmptyState, {
     subtitle: noResultsDescription,
     title: noResultsTitle,

package/es/components/AddSelect/AddSelectBreadcrumbs.js

@@ -5,35 +5,42 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import { defineProperty as _defineProperty } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import React__default from 'react';
 import { Breadcrumb, BreadcrumbItem } from '@carbon/react';
 import PropTypes from '../../_virtual/index.js';
 import cx from 'classnames';
 import { pkg } from '../../settings.js';
 
-var blockClass = "".concat(pkg.prefix, "--add-select__breadcrumbs");
-var componentName = 'AddSelectBreadcrumbs';
-var AddSelectBreadcrumbs = function AddSelectBreadcrumbs(_ref) {
-  var multi = _ref.multi,
-    onClick = _ref.onClick,
-    path = _ref.path;
-  var clickHandler = function clickHandler(e, idx) {
+// Copyright IBM Corp. 2022, 2022
+//
+// This source code is licensed under the Apache-2.0 license found in the
+// LICENSE file in the root directory of this source tree.
+//
+
+const blockClass = `${pkg.prefix}--add-select__breadcrumbs`;
+const componentName = 'AddSelectBreadcrumbs';
+let AddSelectBreadcrumbs = _ref => {
+  let {
+    multi,
+    onClick,
+    path
+  } = _ref;
+  const clickHandler = (e, idx) => {
     e.preventDefault();
     onClick(idx);
   };
-  var classNames = cx(blockClass, _defineProperty({}, "".concat(blockClass, "-multi"), multi));
+  const classNames = cx(blockClass, {
+    [`${blockClass}-multi`]: multi
+  });
   return /*#__PURE__*/React__default.createElement(Breadcrumb, {
     noTrailingSlash: true,
     className: classNames
-  }, path.map(function (entry, idx) {
-    var isCurrentPage = idx === path.length - 1;
+  }, path.map((entry, idx) => {
+    const isCurrentPage = idx === path.length - 1;
     return /*#__PURE__*/React__default.createElement(BreadcrumbItem, {
       key: entry.id,
       isCurrentPage: isCurrentPage,
-      onClick: function onClick(e) {
-        return clickHandler(e, idx);
-      },
+      onClick: e => clickHandler(e, idx),
       href: "#"
     }, entry.title);
   }));