@carbon/ibm-products 2.43.2-canary.33 → 2.43.2-canary.330

package/es/components/EmptyStates/assets/NotificationsIllustration.js

@@ -7,12 +7,12 @@
 
 import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../../_virtual/_rollupPluginBabelHelpers.js';
 import React__default from 'react';
-import PropTypes from '../../../node_modules/prop-types/index.js';
+import PropTypes from '../../../_virtual/index.js';
 import cx from 'classnames';
 import { pkg } from '../../../settings.js';
 import uuidv4 from '../../../global/js/utils/uuidv4.js';
 
-var _stop, _stop2, _stop3, _stop4, _stop5, _stop6, _stop7, _stop8, _stop9, _stop10, _stop11, _stop12, _stop13, _stop14, _path, _path2, _stop15, _stop16, _stop17, _stop18, _stop19, _stop20, _stop21, _stop22, _stop23, _stop24, _stop25, _stop26, _stop27, _stop28, _stop29, _stop30, _stop31, _stop32, _stop33, _stop34, _stop35, _stop36, _stop37, _stop38, _stop39, _stop40, _stop41, _path3;
+var _stop, _stop2, _stop3, _stop4, _stop5, _stop6, _stop7, _stop8, _stop9, _stop10, _stop11, _stop12, _stop13, _stop14, _path, _path2, _path3, _stop15, _stop16, _stop17, _stop18, _stop19, _stop20, _stop21, _stop22, _stop23, _stop24, _stop25, _stop26, _stop27, _stop28, _stop29, _stop30, _stop31, _stop32, _stop33, _stop34, _stop35, _stop36, _stop37, _stop38, _stop39, _stop40, _stop41, _path4;
 var _excluded = ["theme", "size", "alt"];
 
 // The block part of our conventional BEM class names (blockClass__E--M).
@@ -104,7 +104,7 @@ var NotificationsIllustration = function NotificationsIllustration(_ref) {
     offset: 0.97,
     stopColor: "#262626",
     stopOpacity: 0
-  }))), /*#__PURE__*/React__default.createElement("style", null, ".prefix__f_dark_".concat(svgId, "{fill:#525252}"))), _path || (_path = /*#__PURE__*/React__default.createElement("path", {
+  })))), _path || (_path = /*#__PURE__*/React__default.createElement("path", {
     fill: "none",
     d: "M0 0h80v80H0z"
   })), _path2 || (_path2 = /*#__PURE__*/React__default.createElement("path", {
@@ -119,10 +119,10 @@ var NotificationsIllustration = function NotificationsIllustration(_ref) {
   }), /*#__PURE__*/React__default.createElement("path", {
     d: "M59.48 28.88a3.17 3.17 0 011.42 2.47l-.1 36.08c0 .9-.65 1.26-1.42.81l-26.7-15.4-2.26 4.22a.9.9 0 01-1.33.28 3.07 3.07 0 01-1.22-1.53l-2.33-7.09-9-5.2a3.15 3.15 0 01-1.43-2.46L15.23 5c0-.9.64-1.27 1.43-.81z",
     fill: "url(#prefix__c_dark_".concat(svgId, ")")
-  }), /*#__PURE__*/React__default.createElement("path", {
-    className: "prefix__f_dark_".concat(svgId),
+  }), _path3 || (_path3 = /*#__PURE__*/React__default.createElement("path", {
+    fill: "#525252",
     d: "M57.99 37.07l-.01 3.9L18.03 17.9l.01-3.9 39.95 23.07zM57.99 45.11l-.01 3.91-39.95-23.07.01-3.9 39.95 23.06zM44.62 45.04l-.01 3.9L18.03 33.6l.01-3.9 26.58 15.34z"
-  }), /*#__PURE__*/React__default.createElement("path", {
+  })), /*#__PURE__*/React__default.createElement("path", {
     d: "M60.76 30.55a2.54 2.54 0 01.14.8v3.95l.41-.13v-3.82a3.54 3.54 0 00-1.63-2.82L16.86 3.8a2.09 2.09 0 00-.44-.19l-.78.45a1 1 0 01.21-.06h.48l.27.12 21.47 12.4 21.41 12.36a3.19 3.19 0 011.28 1.67z",
     fill: "url(#prefix__d_dark_".concat(svgId, ")")
   })) : /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("defs", null, /*#__PURE__*/React__default.createElement("linearGradient", {
@@ -285,7 +285,7 @@ var NotificationsIllustration = function NotificationsIllustration(_ref) {
     offset: 0.97,
     stopColor: "#d0d0d0",
     stopOpacity: 0
-  }))), /*#__PURE__*/React__default.createElement("style", null, ".prefix__f_".concat(svgId, "{fill:url(#prefix__e_").concat(svgId, ")}"))), _path3 || (_path3 = /*#__PURE__*/React__default.createElement("path", {
+  })))), _path4 || (_path4 = /*#__PURE__*/React__default.createElement("path", {
     fill: "none",
     d: "M0 0h80v80H0z"
   })), /*#__PURE__*/React__default.createElement("path", {
@@ -301,13 +301,13 @@ var NotificationsIllustration = function NotificationsIllustration(_ref) {
     d: "M63.45 26.58L20.63 1.86a1 1 0 00-1-.1l-4 2.3a1 1 0 011 .1l42.85 24.72a3.17 3.17 0 011.42 2.47l-.1 36.08a1 1 0 01-.42.91l4-2.3a1 1 0 00.42-.91L64.88 29a3.14 3.14 0 00-1.43-2.42z",
     fill: "url(#prefix__d_".concat(svgId, ")")
   }), /*#__PURE__*/React__default.createElement("path", {
-    className: "prefix__f_".concat(svgId),
+    fill: "url(#prefix__e_".concat(svgId, ")"),
     d: "M59.48 28.88a3.17 3.17 0 011.42 2.47l-.1 36.08c0 .9-.65 1.26-1.42.81l-26.7-15.4-2.26 4.22a.9.9 0 01-1.33.28 3.07 3.07 0 01-1.22-1.53l-2.33-7.09-9-5.2a3.15 3.15 0 01-1.43-2.46L15.23 5c0-.9.64-1.27 1.43-.81z"
   }), /*#__PURE__*/React__default.createElement("path", {
     d: "M59.48 28.88a3.17 3.17 0 011.42 2.47l-.1 36.08c0 .9-.65 1.26-1.42.81l-26.7-15.4-2.26 4.22a.9.9 0 01-1.33.28 3.07 3.07 0 01-1.22-1.53l-2.33-7.09-9-5.2a3.15 3.15 0 01-1.43-2.46L15.23 5c0-.9.64-1.27 1.43-.81z",
     fill: "url(#prefix__f_".concat(svgId, ")")
   }), /*#__PURE__*/React__default.createElement("path", {
-    className: "prefix__f_".concat(svgId),
+    fill: "url(#prefix__e_".concat(svgId, ")"),
     d: "M59.48 28.88a3.17 3.17 0 011.42 2.47l-.1 36.08c0 .9-.65 1.26-1.42.81l-26.7-15.4-2.26 4.22a.9.9 0 01-1.33.28 3.07 3.07 0 01-1.22-1.53l-2.33-7.09-9-5.2a3.15 3.15 0 01-1.43-2.46L15.23 5c0-.9.64-1.27 1.43-.81z"
   }), /*#__PURE__*/React__default.createElement("path", {
     fill: "url(#prefix__h_".concat(svgId, ")"),

package/es/components/EmptyStates/assets/UnauthorizedIllustration.d.ts

@@ -3,7 +3,7 @@ export function UnauthorizedIllustration({ theme, size, alt, ...rest }: {
     theme: any;
     size: any;
     alt: any;
-}): import("react/jsx-runtime").JSX.Element;
+}): React.JSX.Element;
 export namespace UnauthorizedIllustration {
     namespace propTypes {
         let alt: PropTypes.Validator<string>;
@@ -12,4 +12,5 @@ export namespace UnauthorizedIllustration {
     }
 }
 export default UnauthorizedIllustration;
+import React from 'react';
 import PropTypes from 'prop-types';

package/es/components/EmptyStates/assets/UnauthorizedIllustration.js

@@ -7,7 +7,7 @@
 
 import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../../_virtual/_rollupPluginBabelHelpers.js';
 import React__default from 'react';
-import PropTypes from '../../../node_modules/prop-types/index.js';
+import PropTypes from '../../../_virtual/index.js';
 import cx from 'classnames';
 import { pkg } from '../../../settings.js';
 import uuidv4 from '../../../global/js/utils/uuidv4.js';

package/es/components/EmptyStates/index.d.ts

@@ -1,8 +1,22 @@
-export { EmptyState } from "./EmptyState";
-export { EmptyStateV2 } from "./EmptyStateV2";
-export { ErrorEmptyState } from "./ErrorEmptyState";
-export { NoDataEmptyState } from "./NoDataEmptyState";
-export { NoTagsEmptyState } from "./NoTagsEmptyState";
-export { NotFoundEmptyState } from "./NotFoundEmptyState";
-export { NotificationsEmptyState } from "./NotificationsEmptyState";
-export { UnauthorizedEmptyState } from "./UnauthorizedEmptyState";
+/**
+ * Copyright IBM Corp. 2020, 2021
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+export { EmptyState } from './EmptyState';
+export { EmptyStateV2 } from './EmptyStateV2';
+export { ErrorEmptyState } from './ErrorEmptyState';
+export { NoDataEmptyState } from './NoDataEmptyState';
+export { NoTagsEmptyState } from './NoTagsEmptyState';
+export { NotFoundEmptyState } from './NotFoundEmptyState';
+export { NotificationsEmptyState } from './NotificationsEmptyState';
+export { UnauthorizedEmptyState } from './UnauthorizedEmptyState';
+export type { EmptyStateProps } from './EmptyState';
+export type { EmptyStateV2Props } from './EmptyStateV2';
+export type { ErrorEmptyStateProps } from './ErrorEmptyState';
+export type { NoDataEmptyStateProps } from './NoDataEmptyState';
+export type { NoTagsEmptyStateProps } from './NoTagsEmptyState';
+export type { NotFoundEmptyStateProps } from './NotFoundEmptyState';
+export type { NotificationsEmptyStateProps } from './NotificationsEmptyState';
+export type { UnauthorizedEmptyStateProps } from './UnauthorizedEmptyState';

package/es/components/ExportModal/ExportModal.d.ts

@@ -1,12 +1,12 @@
 /// <reference path="../../../src/custom-typings/index.d.ts" />
-import React, { ReactNode } from 'react';
 import { ComposedModal } from '@carbon/react';
+import React, { ReactNode, RefObject } from 'react';
 type InputType = 'text' | 'password';
 type PreformattedExtensions = {
     extension?: string;
     description?: string;
 };
-interface RemoveModalProps extends React.ComponentProps<typeof ComposedModal> {
+export interface ExportModalProps extends React.ComponentProps<typeof ComposedModal> {
     /**
      * Body content for the modal
      */
@@ -99,6 +99,10 @@ interface RemoveModalProps extends React.ComponentProps<typeof ComposedModal> {
      * The text displayed at the top of the modal
      */
     title: string;
+    /**
+     * Reference to trigger button
+     */
+    triggerButtonRef?: RefObject<any>;
     /**
      * array of valid extensions the file can have
      */
@@ -107,7 +111,7 @@ interface RemoveModalProps extends React.ComponentProps<typeof ComposedModal> {
 /**
  * Modal dialog version of the export pattern
  */
-export declare let ExportModal: React.ForwardRefExoticComponent<RemoveModalProps & {
+export declare let ExportModal: React.ForwardRefExoticComponent<ExportModalProps & {
     children?: React.ReactNode;
 } & React.RefAttributes<unknown>>;
 export {};

package/es/components/ExportModal/ExportModal.js

@@ -6,18 +6,18 @@
  */
 
 import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, defineProperty as _defineProperty, extends as _extends, objectSpread2 as _objectSpread2 } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import { unstable_FeatureFlags, ComposedModal, ModalHeader, ModalBody, FormGroup, RadioButtonGroup, RadioButton, TextInput, PasswordInput, Loading, ModalFooter, Button } from '@carbon/react';
+import { CheckmarkFilled, ErrorFilled } from '@carbon/react/icons';
 import React__default, { forwardRef, useState, useEffect, useRef } from 'react';
-import { ComposedModal, ModalHeader, ModalBody, FormGroup, RadioButtonGroup, RadioButton, TextInput, PasswordInput, Loading, ModalFooter, Button } from '@carbon/react';
+import PropTypes from '../../_virtual/index.js';
 import cx from 'classnames';
-import { CheckmarkFilled, ErrorFilled } from '@carbon/react/icons';
-import PropTypes from '../../node_modules/prop-types/index.js';
 import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
-import uuidv4 from '../../global/js/utils/uuidv4.js';
-import { pkg } from '../../settings.js';
+import { pkg, carbon } from '../../settings.js';
 import { usePortalTarget } from '../../global/js/hooks/usePortalTarget.js';
+import uuidv4 from '../../global/js/utils/uuidv4.js';
 
 var _Loading;
-var _excluded = ["body", "className", "error", "errorMessage", "filename", "hidePasswordLabel", "inputLabel", "inputType", "invalidInputText", "loading", "loadingMessage", "onClose", "onRequestSubmit", "open", "portalTarget", "preformattedExtensions", "preformattedExtensionsLabel", "primaryButtonText", "secondaryButtonText", "showPasswordLabel", "successMessage", "successful", "title", "validExtensions"];
+var _excluded = ["body", "className", "error", "errorMessage", "filename", "hidePasswordLabel", "inputLabel", "inputType", "invalidInputText", "loading", "loadingMessage", "onClose", "onRequestSubmit", "open", "portalTarget", "preformattedExtensions", "preformattedExtensionsLabel", "primaryButtonText", "secondaryButtonText", "showPasswordLabel", "successMessage", "successful", "title", "triggerButtonRef", "validExtensions"];
 var componentName = 'ExportModal';
 
 // Default values for props
@@ -55,9 +55,11 @@ var ExportModal = /*#__PURE__*/forwardRef(function (_ref, ref) {
     successMessage = _ref.successMessage,
     successful = _ref.successful,
     title = _ref.title,
+    triggerButtonRef = _ref.triggerButtonRef,
     _ref$validExtensions = _ref.validExtensions,
     validExtensions = _ref$validExtensions === void 0 ? defaults.validExtensions : _ref$validExtensions,
     rest = _objectWithoutProperties(_ref, _excluded);
+  var blockClass = "".concat(pkg.prefix, "--export-modal");
   var _useState = useState(''),
     _useState2 = _slicedToArray(_useState, 2),
     name = _useState2[0],
@@ -80,6 +82,12 @@ var ExportModal = /*#__PURE__*/forwardRef(function (_ref, ref) {
       setExtension(preformattedExtensions === null || preformattedExtensions === void 0 || (_preformattedExtensio2 = preformattedExtensions[0]) === null || _preformattedExtensio2 === void 0 ? void 0 : _preformattedExtensio2.extension);
     }
   }, [filename, preformattedExtensions, open]);
+  useEffect(function () {
+    if (successful) {
+      var button = document.querySelector(".".concat(blockClass, " .").concat(carbon.prefix, "--modal-close-button button"));
+      button === null || button === void 0 || button.focus();
+    }
+  }, [successful, blockClass]);
   var onNameChangeHandler = function onNameChangeHandler(evt) {
     setName(evt.target.value);
   };
@@ -106,7 +114,6 @@ var ExportModal = /*#__PURE__*/forwardRef(function (_ref, ref) {
     }
     return false;
   };
-  var blockClass = "".concat(pkg.prefix, "--export-modal");
   var internalId = useRef(uuidv4());
   var primaryButtonDisabled = loading || !name || hasInvalidExtension();
   var submitted = loading || error || successful;
@@ -119,11 +126,14 @@ var ExportModal = /*#__PURE__*/forwardRef(function (_ref, ref) {
     invalidText: invalidInputText,
     onBlur: onBlurHandler
   }, 'data-modal-primary-focus', true);
-  return renderPortalUse( /*#__PURE__*/React__default.createElement(ComposedModal, _extends({}, rest, {
+  return renderPortalUse( /*#__PURE__*/React__default.createElement(unstable_FeatureFlags, {
+    enableExperimentalFocusWrapWithoutSentinels: true
+  }, /*#__PURE__*/React__default.createElement(ComposedModal, _extends({}, rest, {
     className: cx(blockClass, className),
     "aria-label": title,
     size: "sm",
-    preventCloseOnClickOutside: true
+    preventCloseOnClickOutside: true,
+    launcherButtonRef: triggerButtonRef
   }, _objectSpread2({
     open: open,
     ref: ref,
@@ -158,8 +168,11 @@ var ExportModal = /*#__PURE__*/forwardRef(function (_ref, ref) {
     hidePasswordLabel: hidePasswordLabel,
     tooltipPosition: "left"
   })))), /*#__PURE__*/React__default.createElement("div", {
+    "aria-live": "polite",
     className: "".concat(blockClass, "__messaging")
   }, loading && /*#__PURE__*/React__default.createElement(React__default.Fragment, null, _Loading || (_Loading = /*#__PURE__*/React__default.createElement(Loading, {
+    "aria-live": "off",
+    description: "",
     small: true,
     withOverlay: false
   })), /*#__PURE__*/React__default.createElement("p", null, loadingMessage)), successful && /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(CheckmarkFilled, {
@@ -179,7 +192,7 @@ var ExportModal = /*#__PURE__*/forwardRef(function (_ref, ref) {
     kind: "primary",
     onClick: onSubmitHandler,
     disabled: primaryButtonDisabled
-  }, primaryButtonText))));
+  }, primaryButtonText)))));
 });
 
 // Return a placeholder if not released and not enabled by feature flag
@@ -283,6 +296,10 @@ ExportModal.propTypes = {
    * The text displayed at the top of the modal
    */
   title: PropTypes.string.isRequired,
+  /**
+   * Sets the trigger button ref
+   */
+  triggerButtonRef: PropTypes.any,
   /**
    * array of valid extensions the file can have
    */

package/es/components/ExportModal/index.d.ts

@@ -1 +1,2 @@
-export { ExportModal } from "./ExportModal";
+export { ExportModal } from './ExportModal';
+export type { ExportModalProps } from './ExportModal';

package/es/components/ExpressiveCard/ExpressiveCard.d.ts

@@ -8,11 +8,15 @@ type ActionIcon = {
     iconDescription?: string;
     href?: string;
 };
-interface ExpressiveCardProps extends PropsWithChildren {
+export interface ExpressiveCardProps extends PropsWithChildren {
     /**
      * Icons that are displayed on card. Refer to design documentation for implementation guidelines. Note- href will supersede onClick
      */
     actionIcons?: ActionIcon[];
+    /**
+     * Optional prop that is intended for any scenario where something is being generated by AI to reinforce AI transparency, accountability, and explainability at the UI level.
+     */
+    aiLabel?: ReactNode | boolean;
     /**
      * Content that shows in the body of the card
      */
@@ -87,6 +91,7 @@ interface ExpressiveCardProps extends PropsWithChildren {
     /**
      * **Experimental:** For all cases a `Slug` component can be provided.
      * Clickable tiles only accept a boolean value of true and display a hollow slug.
+     * @deprecated please use the `aiLabel` prop
      */
     slug?: ReactNode | boolean;
     /**

package/es/components/ExpressiveCard/ExpressiveCard.js

@@ -7,10 +7,10 @@
 
 import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import React__default, { forwardRef } from 'react';
-import PropTypes from '../../node_modules/prop-types/index.js';
+import PropTypes from '../../_virtual/index.js';
 import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
-import { prepareProps } from '../../global/js/utils/props-helper.js';
 import { pkg } from '../../settings.js';
+import { prepareProps } from '../../global/js/utils/props-helper.js';
 import { Card } from '../Card/Card.js';
 
 var componentName = 'ExpressiveCard';
@@ -36,6 +36,10 @@ ExpressiveCard.propTypes = {
     iconDescription: PropTypes.string,
     href: PropTypes.string
   })),
+  /**
+   * Optional prop that is intended for any scenario where something is being generated by AI to reinforce AI transparency, accountability, and explainability at the UI level.
+   */
+  aiLabel: PropTypes.oneOfType([PropTypes.node, PropTypes.bool]),
   /**
    * Content that shows in the body of the card
    */
@@ -114,6 +118,7 @@ ExpressiveCard.propTypes = {
   /**
    * **Experimental:** For all cases a `Slug` component can be provided.
    * Clickable tiles only accept a boolean value of true and display a hollow slug.
+   * @deprecated please use the `aiLabel` prop
    */
   slug: PropTypes.oneOfType([PropTypes.node, PropTypes.bool]),
   /**

package/es/components/ExpressiveCard/index.d.ts

@@ -1 +1,2 @@
-export { ExpressiveCard } from "./ExpressiveCard";
+export { ExpressiveCard } from './ExpressiveCard';
+export type { ExpressiveCardProps } from './ExpressiveCard';

package/es/components/FeatureFlags/index.d.ts

@@ -1,37 +1,43 @@
 /**
- * Supports an object of feature flag values with the `flags` prop, merging them
+ * Copyright IBM Corp. 2024, 2024
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import React from 'react';
+import PropTypes from 'prop-types';
+/**
+ * Our FeatureFlagContext is used alongside the FeatureFlags component to enable
+ * or disable feature flags in a given React tree
+ */
+declare const FeatureFlagContext: React.Context<any>;
+/**
+ * Supports individual feature flag values as props, merging them
  * along with the current `FeatureFlagContext` to provide consumers to check if
  * a feature flag is enabled or disabled in a given React tree
  */
-export function FeatureFlags({ children, flags }: {
+declare function FeatureFlags({ children, flags, ...newFlags }: {
+    [x: string]: any;
     children: any;
     flags?: {} | undefined;
-}): import("react/jsx-runtime").JSX.Element;
-export namespace FeatureFlags {
-    namespace propTypes {
-        let children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-        let flags: PropTypes.Requireable<{
+}): React.JSX.Element;
+declare namespace FeatureFlags {
+    var propTypes: {
+        children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        /**
+         * Provide the feature flags to enabled or disabled in the current React tree, this has been deprecated. as we are going to pass individual boolean props for each flag.
+         */
+        flags: PropTypes.Requireable<{
             [x: string]: boolean | null | undefined;
         }>;
-    }
+    };
 }
 /**
- * Our FeatureFlagContext is used alongside the FeatureFlags component to enable
- * or disable feature flags in a given React tree
+ * Access whether a given flag is enabled or disabled in a given FeatureFlagContext
  */
-export const FeatureFlagContext: React.Context<any>;
+declare function useFeatureFlag(flag: string): boolean;
 /**
  * Access all feature flag information for the given FeatureFlagContext
- *
- * @returns {FeatureFlagScope}
- */
-export function useFeatureFlags(): FeatureFlagScope;
-/**
- * Access whether a given flag is enabled or disabled in a given
- * FeatureFlagContext
- *
- * @returns {boolean}
  */
-export function useFeatureFlag(flag: any): boolean;
-import PropTypes from 'prop-types';
-import React from 'react';
+declare function useFeatureFlags(): any;
+export { FeatureFlags, FeatureFlagContext, useFeatureFlags, useFeatureFlag };

package/es/components/FeatureFlags/index.js

@@ -5,11 +5,13 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import { slicedToArray as _slicedToArray } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import { objectWithoutProperties as _objectWithoutProperties, objectSpread2 as _objectSpread2, slicedToArray as _slicedToArray } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import React__default, { useContext, useState, useRef, useEffect, createContext } from 'react';
-import PropTypes from '../../node_modules/prop-types/index.js';
+import PropTypes from '../../_virtual/index.js';
 import { createScope, FeatureFlags as FeatureFlags$1 } from '@carbon/feature-flags';
 
+var _excluded = ["children", "flags"];
+
 /**
  * Our FeatureFlagContext is used alongside the FeatureFlags component to enable
  * or disable feature flags in a given React tree
@@ -17,21 +19,27 @@ import { createScope, FeatureFlags as FeatureFlags$1 } from '@carbon/feature-fla
 var FeatureFlagContext = /*#__PURE__*/createContext(FeatureFlags$1);
 
 /**
- * Supports an object of feature flag values with the `flags` prop, merging them
+ * Supports individual feature flag values as props, merging them
  * along with the current `FeatureFlagContext` to provide consumers to check if
  * a feature flag is enabled or disabled in a given React tree
  */
 function FeatureFlags(_ref) {
   var children = _ref.children,
     _ref$flags = _ref.flags,
-    flags = _ref$flags === void 0 ? {} : _ref$flags;
+    flags = _ref$flags === void 0 ? {} : _ref$flags,
+    newFlags = _objectWithoutProperties(_ref, _excluded);
   var parentScope = useContext(FeatureFlagContext);
+  var newFlagsObject = Object.keys(newFlags).reduce(function (acc, key) {
+    acc[key] = newFlags[key];
+    return acc;
+  }, {});
+  var combinedFlags = _objectSpread2(_objectSpread2({}, newFlagsObject), flags);
   var _useState = useState(parentScope),
     _useState2 = _slicedToArray(_useState, 2),
     prevParentScope = _useState2[0],
     setPrevParentScope = _useState2[1];
   var _useState3 = useState(function () {
-      var scope = createScope(flags);
+      var scope = createScope(combinedFlags);
       scope.mergeWithScope(parentScope);
       return scope;
     }),
@@ -39,16 +47,15 @@ function FeatureFlags(_ref) {
     scope = _useState4[0],
     updateScope = _useState4[1];
   if (parentScope !== prevParentScope) {
-    var _scope = createScope(flags);
+    var _scope = createScope(combinedFlags);
     _scope.mergeWithScope(parentScope);
     updateScope(_scope);
     setPrevParentScope(parentScope);
   }
 
-  // We use a custom hook to detect if any of the keys or their values change
-  // for flags that are passed in. If they have changed, then we re-create the
-  // FeatureFlagScope using the new flags
-  useChangedValue(flags, isEqual, function (changedFlags) {
+  // We use a custom hook to detect if any of the individual flag props or their values change
+  // If any flags have changed, we re-create the FeatureFlagScope using the updated flags
+  useChangedValue(combinedFlags, isEqual, function (changedFlags) {
     var scope = createScope(changedFlags);
     scope.mergeWithScope(parentScope);
     updateScope(scope);
@@ -60,7 +67,7 @@ function FeatureFlags(_ref) {
 FeatureFlags.propTypes = {
   children: PropTypes.node,
   /**
-   * Provide the feature flags to enabled or disabled in the current React tree
+   * Provide the feature flags to enabled or disabled in the current React tree, this has been deprecated. as we are going to pass individual boolean props for each flag.
    */
   flags: PropTypes.objectOf(PropTypes.bool)
 };
@@ -100,21 +107,15 @@ function useChangedValue(value, compare, callback) {
 }
 
 /**
- * Access whether a given flag is enabled or disabled in a given
- * FeatureFlagContext
- *
- * @returns {boolean}
+ * Access whether a given flag is enabled or disabled in a given FeatureFlagContext
  */
 function useFeatureFlag(flag) {
   var scope = useContext(FeatureFlagContext);
-  // console.log(scope);
   return scope.enabled(flag);
 }
 
 /**
  * Access all feature flag information for the given FeatureFlagContext
- *
- * @returns {FeatureFlagScope}
  */
 function useFeatureFlags() {
   return useContext(FeatureFlagContext);
@@ -125,9 +126,6 @@ function useFeatureFlags() {
  * comparison since the objects we are comparing are objects with boolean flags
  * from the flags prop in the `FeatureFlags` component
  *
- * @param {object} a
- * @param {object} b
- * @returns {boolean}
  */
 function isEqual(a, b) {
   if (a === b) {

package/es/components/FilterPanel/FilterPanel.js

@@ -7,7 +7,7 @@
 
 import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import React__default from 'react';
-import PropTypes from '../../node_modules/prop-types/index.js';
+import PropTypes from '../../_virtual/index.js';
 import cx from 'classnames';
 import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
 import { pkg } from '../../settings.js';

package/es/components/FilterPanel/FilterPanelAccordion/FilterPanelAccordion.js

@@ -7,7 +7,7 @@
 
 import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../../_virtual/_rollupPluginBabelHelpers.js';
 import React__default from 'react';
-import PropTypes from '../../../node_modules/prop-types/index.js';
+import PropTypes from '../../../_virtual/index.js';
 import cx from 'classnames';
 import { Accordion } from '@carbon/react';
 import { getDevtoolsProps } from '../../../global/js/utils/devtools.js';

package/es/components/FilterPanel/FilterPanelAccordionItem/FilterPanelAccordionItem.js

@@ -7,13 +7,13 @@
 
 import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../../_virtual/_rollupPluginBabelHelpers.js';
 import React__default, { Children } from 'react';
-import PropTypes from '../../../node_modules/prop-types/index.js';
+import PropTypes from '../../../_virtual/index.js';
 import cx from 'classnames';
 import { AccordionItem, ListItem } from '@carbon/react';
 import { getDevtoolsProps } from '../../../global/js/utils/devtools.js';
 import { pkg } from '../../../settings.js';
-import { FilterPanelLabel } from '../FilterPanelLabel/FilterPanelLabel.js';
 import { TruncatedList } from '../../TruncatedList/TruncatedList.js';
+import { FilterPanelLabel } from '../FilterPanelLabel/FilterPanelLabel.js';
 
 var _excluded = ["accordionItemProps", "truncatedListProps", "children", "className", "count", "labelText", "title"];
 

package/es/components/FilterPanel/FilterPanelCheckbox/FilterPanelCheckbox.js

@@ -7,7 +7,7 @@
 
 import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../../_virtual/_rollupPluginBabelHelpers.js';
 import React__default from 'react';
-import PropTypes from '../../../node_modules/prop-types/index.js';
+import PropTypes from '../../../_virtual/index.js';
 import cx from 'classnames';
 import { Checkbox } from '@carbon/react';
 import { getDevtoolsProps } from '../../../global/js/utils/devtools.js';

package/es/components/FilterPanel/FilterPanelCheckboxWithOverflow/FilterPanelCheckboxWithOverflow.js

@@ -7,7 +7,7 @@
 
 import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, extends as _extends, objectDestructuringEmpty as _objectDestructuringEmpty, defineProperty as _defineProperty } from '../../../_virtual/_rollupPluginBabelHelpers.js';
 import React__default, { useState, useRef, useEffect } from 'react';
-import PropTypes from '../../../node_modules/prop-types/index.js';
+import PropTypes from '../../../_virtual/index.js';
 import cx from 'classnames';
 import { OverflowMenu } from '@carbon/react';
 import { getDevtoolsProps } from '../../../global/js/utils/devtools.js';
@@ -51,7 +51,7 @@ var FilterPanelCheckboxWithOverflow = /*#__PURE__*/React__default.forwardRef(fun
     setShowMenuButton = _useState4[1];
   // Destructure overflow menu properties.
   var other = _extends({}, (_objectDestructuringEmpty(overflowMenuProps), overflowMenuProps));
-  var backupRef = useRef();
+  var backupRef = useRef(undefined);
   var localRef = ref || backupRef;
   var setHideButton = function setHideButton(activeElement) {
     if (!menuIsOpen && !localRef.current.contains(activeElement)) {

package/es/components/FilterPanel/FilterPanelGroup/FilterPanelGroup.js

@@ -7,7 +7,7 @@
 
 import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../../_virtual/_rollupPluginBabelHelpers.js';
 import React__default from 'react';
-import PropTypes from '../../../node_modules/prop-types/index.js';
+import PropTypes from '../../../_virtual/index.js';
 import cx from 'classnames';
 import { getDevtoolsProps } from '../../../global/js/utils/devtools.js';
 import { pkg } from '../../../settings.js';

package/es/components/FilterPanel/FilterPanelLabel/FilterPanelLabel.js

@@ -7,7 +7,7 @@
 
 import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../../_virtual/_rollupPluginBabelHelpers.js';
 import React__default from 'react';
-import PropTypes from '../../../node_modules/prop-types/index.js';
+import PropTypes from '../../../_virtual/index.js';
 import cx from 'classnames';
 import { getDevtoolsProps } from '../../../global/js/utils/devtools.js';
 import { pkg } from '../../../settings.js';

package/es/components/FilterPanel/FilterPanelSearch/FilterPanelSearch.js

@@ -7,7 +7,7 @@
 
 import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, extends as _extends } from '../../../_virtual/_rollupPluginBabelHelpers.js';
 import React__default, { useState, useEffect } from 'react';
-import PropTypes from '../../../node_modules/prop-types/index.js';
+import PropTypes from '../../../_virtual/index.js';
 import cx from 'classnames';
 import { Search } from '@carbon/react';
 import { getDevtoolsProps } from '../../../global/js/utils/devtools.js';

package/es/components/FilterSummary/FilterSummary.d.ts

@@ -9,7 +9,7 @@ export interface Filter {
     key: string;
     value: string;
 }
-interface FilterSummaryProps {
+export interface FilterSummaryProps {
     className?: string;
     clearButtonInline?: boolean;
     clearFilters: () => void;