@carbon/ibm-products 2.53.0 → 2.54.0-canary.0

package/lib/components/APIKeyModal/APIKeyDownloader.d.ts

@@ -1,15 +1,17 @@
-export function APIKeyDownloader({ apiKey, body, fileName, fileType, linkText, }: {
+export function APIKeyDownloader({ apiKey, body, fileName, fileType, linkText, downloadLinkLabel, }: {
     apiKey: any;
     body: any;
     fileName: any;
     fileType: any;
     linkText: any;
+    downloadLinkLabel: any;
 }): React.JSX.Element;
 export namespace APIKeyDownloader {
     export { componentName as displayName };
     export namespace propTypes {
         let apiKey: PropTypes.Validator<string>;
         let body: PropTypes.Validator<string>;
+        let downloadLinkLabel: PropTypes.Requireable<string>;
         let fileName: PropTypes.Validator<string>;
         let fileType: PropTypes.Validator<string>;
         let linkText: PropTypes.Validator<string>;

package/lib/components/APIKeyModal/APIKeyDownloader.js

@@ -18,7 +18,8 @@ var APIKeyDownloader = function APIKeyDownloader(_ref) {
     body = _ref.body,
     fileName = _ref.fileName,
     fileType = _ref.fileType,
-    linkText = _ref.linkText;
+    linkText = _ref.linkText,
+    downloadLinkLabel = _ref.downloadLinkLabel;
   var _useState = React.useState({}),
     _useState2 = _rollupPluginBabelHelpers.slicedToArray(_useState, 2),
     linkProps = _useState2[0],
@@ -63,8 +64,10 @@ var APIKeyDownloader = function APIKeyDownloader(_ref) {
   }, /*#__PURE__*/React.createElement("p", {
     className: "".concat(settings.pkg.prefix, "--apikey-modal__messaging-text")
   }, body, ' ', /*#__PURE__*/React.createElement("a", _rollupPluginBabelHelpers.extends({}, linkProps, {
-    className: "".concat(settings.pkg.prefix, "--apikey-modal__download-link")
-  }), linkText)));
+    className: "".concat(settings.pkg.prefix, "--apikey-modal__download-link"),
+    "aria-label": downloadLinkLabel !== null && downloadLinkLabel !== void 0 ? downloadLinkLabel : linkText,
+    role: "button"
+  }), downloadLinkLabel !== null && downloadLinkLabel !== void 0 ? downloadLinkLabel : linkText)));
 };
 APIKeyDownloader.displayName = componentName;
 APIKeyDownloader.propTypes = {
@@ -76,6 +79,10 @@ APIKeyDownloader.propTypes = {
    * body content for the downloader
    */
   body: index.default.string.isRequired,
+  /**
+   * aria-label for the download link
+   */
+  downloadLinkLabel: index.default.string,
   /**
    * designates the name of downloadable json file with the key. if not specified will default to 'apikey'
    */

package/lib/components/APIKeyModal/APIKeyModal.js

@@ -19,9 +19,10 @@ var usePortalTarget = require('../../global/js/hooks/usePortalTarget.js');
 var devtools = require('../../global/js/utils/devtools.js');
 var propsHelper = require('../../global/js/utils/props-helper.js');
 var uuidv4 = require('../../global/js/utils/uuidv4.js');
+var useFocus = require('../../global/js/hooks/useFocus.js');
 
 var _ErrorFilled, _InformationFilled;
-var _excluded = ["apiKey", "apiKeyLabel", "apiKeyName", "body", "className", "closeButtonText", "copyButtonText", "copyErrorText", "copyIconDescription", "customSteps", "downloadBodyText", "downloadFileName", "downloadFileType", "downloadLinkText", "editButtonText", "editSuccess", "editSuccessTitle", "editing", "error", "errorText", "generateButtonText", "generateSuccessBody", "generateSuccessTitle", "generateTitle", "hasAPIKeyVisibilityToggle", "hasDownloadLink", "hideAPIKeyLabel", "loading", "loadingText", "modalLabel", "nameHelperText", "nameLabel", "namePlaceholder", "nameRequired", "nextStepButtonText", "onClose", "onCopy", "onRequestEdit", "onRequestGenerate", "open", "portalTarget", "previousStepButtonText", "showAPIKeyLabel"];
+var _excluded = ["apiKey", "apiKeyLabel", "apiKeyName", "body", "className", "closeButtonText", "copyButtonText", "copyErrorText", "copyIconDescription", "customSteps", "downloadBodyText", "downloadFileName", "downloadFileType", "downloadLinkText", "downloadLinkLabel", "editButtonText", "editSuccess", "editSuccessTitle", "editing", "error", "errorText", "generateButtonText", "generateSuccessBody", "generateSuccessTitle", "generateTitle", "hasAPIKeyVisibilityToggle", "hasDownloadLink", "hideAPIKeyLabel", "loading", "loadingText", "modalLabel", "nameHelperText", "nameLabel", "namePlaceholder", "nameRequired", "nextStepButtonText", "onClose", "onCopy", "onRequestEdit", "onRequestGenerate", "open", "portalTarget", "previousStepButtonText", "selectorPrimaryFocus", "showAPIKeyLabel"];
 var componentName = 'APIKeyModal';
 
 // Default values for props
@@ -47,6 +48,8 @@ exports.APIKeyModal = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     downloadFileName = _ref.downloadFileName,
     downloadFileType = _ref.downloadFileType,
     downloadLinkText = _ref.downloadLinkText,
+    _ref$downloadLinkLabe = _ref.downloadLinkLabel,
+    downloadLinkLabel = _ref$downloadLinkLabe === void 0 ? downloadLinkText : _ref$downloadLinkLabe,
     editButtonText = _ref.editButtonText,
     editSuccess = _ref.editSuccess,
     editSuccessTitle = _ref.editSuccessTitle,
@@ -75,6 +78,7 @@ exports.APIKeyModal = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     open = _ref.open,
     portalTargetIn = _ref.portalTarget,
     previousStepButtonText = _ref.previousStepButtonText,
+    selectorPrimaryFocus = _ref.selectorPrimaryFocus,
     showAPIKeyLabel = _ref.showAPIKeyLabel,
     rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
   var _useState = React.useState(null),
@@ -111,11 +115,34 @@ exports.APIKeyModal = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     ref: copyRef
   };
   var blockClass = "".concat(settings.pkg.prefix, "--apikey-modal");
+  var localRef = React.useRef(undefined);
+  var modalRef = ref || localRef;
+  var _useFocus = useFocus.useFocus(modalRef, selectorPrimaryFocus),
+    firstElement = _useFocus.firstElement,
+    keyDownListener = _useFocus.keyDownListener;
   React.useEffect(function () {
     if (copyRef.current && open && apiKeyLoaded) {
       copyRef.current.focus();
     }
   }, [open, apiKeyLoaded]);
+  React.useEffect(function () {
+    if (open) {
+      // Focusing the first element or selectorPrimaryFocus element
+      if (selectorPrimaryFocus && useFocus.getSpecificElement(modalRef === null || modalRef === void 0 ? void 0 : modalRef.current, selectorPrimaryFocus)) {
+        var _window;
+        var specifiedEl = useFocus.getSpecificElement(modalRef === null || modalRef === void 0 ? void 0 : modalRef.current, selectorPrimaryFocus);
+        if (specifiedEl && ((_window = window) === null || _window === void 0 || (_window = _window.getComputedStyle(specifiedEl)) === null || _window === void 0 ? void 0 : _window.display) !== 'none') {
+          setTimeout(function () {
+            return specifiedEl.focus();
+          }, 0);
+          return;
+        }
+      }
+      setTimeout(function () {
+        firstElement === null || firstElement === void 0 || firstElement.focus();
+      }, 0);
+    }
+  }, [firstElement, modalRef, open, selectorPrimaryFocus]);
   var isPrimaryButtonDisabled = function isPrimaryButtonDisabled() {
     if (loading) {
       return true;
@@ -230,10 +257,13 @@ exports.APIKeyModal = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
       onCloseHandler();
     }
   };
-  return renderPortalUse( /*#__PURE__*/React.createElement(react.ComposedModal, _rollupPluginBabelHelpers.extends({}, rest, _rollupPluginBabelHelpers.objectSpread2({
-    open: open,
-    ref: ref
+  return renderPortalUse( /*#__PURE__*/React.createElement(react.unstable_FeatureFlags, {
+    enableExperimentalFocusWrapWithoutSentinels: true
+  }, /*#__PURE__*/React.createElement(react.ComposedModal, _rollupPluginBabelHelpers.extends({}, rest, _rollupPluginBabelHelpers.objectSpread2({
+    open: open
   }, devtools.getDevtoolsProps(componentName)), {
+    ref: modalRef,
+    onKeyDown: keyDownListener,
     className: cx(className, blockClass),
     onClose: onCloseHandler,
     size: "sm",
@@ -291,7 +321,8 @@ exports.APIKeyModal = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     body: downloadBodyText,
     fileName: downloadFileName,
     linkText: downloadLinkText,
-    fileType: downloadFileType
+    fileType: downloadFileType,
+    downloadLinkLabel: downloadLinkLabel
   }) : /*#__PURE__*/React.createElement("div", {
     className: "".concat(blockClass, "__messaging-text")
   }, generateSuccessBody)))), /*#__PURE__*/React.createElement(react.ModalFooter, {
@@ -305,7 +336,7 @@ exports.APIKeyModal = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     kind: "primary",
     onClick: submitHandler,
     disabled: isPrimaryButtonDisabled()
-  }), getPrimaryButtonText()))));
+  }), getPrimaryButtonText())))));
 });
 var customStepsRequiredProps = function customStepsRequiredProps(type) {
   return propsHelper.isRequiredIf(type, function (_ref3) {
@@ -395,6 +426,10 @@ exports.APIKeyModal.propTypes = {
    * designates the file type for the downloadable key
    */
   downloadFileType: downloadRequiredProps(index.default.oneOf(['txt', 'json'])),
+  /**
+   * aria-label for the download link
+   */
+  downloadLinkLabel: downloadRequiredProps(index.default.string),
   /**
    * anchor text for the download link
    */
@@ -514,6 +549,11 @@ exports.APIKeyModal.propTypes = {
    * text that displays in the secondary button when using custom steps to indicate to the user that there is a previous step
    */
   previousStepButtonText: customStepsRequiredProps(index.default.string),
+  /**
+   * Specify a CSS selector that matches the DOM element that should be
+   * focused when the Modal opens.
+   */
+  selectorPrimaryFocus: index.default.string,
   /**
    * label text that's displayed when hovering over visibility toggler to show key
    */

package/lib/components/APIKeyModal/APIKeyModal.types.d.ts

@@ -145,6 +145,11 @@ interface APIKeyModalCommonProps {
      * The DOM node the tearsheet should be rendered within. Defaults to document.body.
      */
     portalTarget?: ReactNode;
+    /**
+     * Specify a CSS selector that matches the DOM element that should be
+     * focused when the Modal opens.
+     */
+    selectorPrimaryFocus?: string;
     /**
      * label text that's displayed when hovering over visibility toggler to show key
      */
@@ -207,6 +212,10 @@ type HasDownloadLinkProps = {
      * anchor text for the download link
      */
     downloadLinkText: string;
+    /**
+     * Aria-label for the download link
+     */
+    downloadLinkLabel?: string;
 };
 export type APIKeyModalProps = APIKeyModalCommonProps & CustomStepConditionalProps & EditingConditionalProps & HasDownloadLinkProps;
 export {};

package/lib/components/ActionBar/ActionBar.d.ts

@@ -1,5 +1,6 @@
+/// <reference path="../../../src/custom-typings/index.d.ts" />
 import React, { PropsWithChildren, ForwardedRef } from 'react';
-import { ButtonProps } from '@carbon/type';
+import { ButtonProps } from '@carbon/react';
 import { CarbonIconType } from '@carbon/icons-react/lib/CarbonIcon';
 interface Action extends ButtonProps {
     id?: string;

package/lib/components/ActionSet/ActionSet.d.ts

@@ -16,7 +16,7 @@ export interface ActionSetProps {
      *
      * See https://react.carbondesignsystem.com/?path=/docs/components-button--default#component-api
      */
-    actions: ButtonProps[];
+    actions: ButtonProps<React.ElementType>[];
     /**
      * The size of buttons to use for the actions. The allowed values are
      * those for the size prop of carbon Button. If this prop is specified, all

package/lib/components/ActionSet/ActionSet.js

@@ -172,6 +172,7 @@ ActionSet.propTypes = {
     label: index.default.string,
     loading: index.default.bool,
     // we duplicate this Button prop to improve the DocGen here
+    /**@ts-ignore*/
     onClick: react.Button.propTypes.onClick
   })))]),
   /**
@@ -180,6 +181,7 @@ ActionSet.propTypes = {
    * the buttons will be set to this size, overriding any 'size' values (if any)
    * supplied in the actions array (if any).
    */
+  /**@ts-ignore*/
   buttonSize: react.Button.propTypes.size,
   /**
    * An optional class or classes to be added to the outermost element.

package/lib/components/AddSelect/types/index.d.ts

@@ -46,5 +46,5 @@ export interface SortOption {
     id?: string;
     direction?: string;
     attribute?: string;
-    itemText?: object;
+    itemText?: ReactNode;
 }

package/lib/components/BreadcrumbWithOverflow/BreadcrumbWithOverflow.d.ts

@@ -1,7 +1,8 @@
-export function BreadcrumbWithOverflow({ breadcrumbs, className, maxVisible, noTrailingSlash, overflowAriaLabel, overflowTooltipAlign, ...other }: {
+export function BreadcrumbWithOverflow({ breadcrumbs, className, label, maxVisible, noTrailingSlash, overflowAriaLabel, overflowTooltipAlign, ...other }: {
     [x: string]: any;
     breadcrumbs: any;
     className: any;
+    label: any;
     maxVisible: any;
     noTrailingSlash: any;
     overflowAriaLabel: any;
@@ -36,6 +37,7 @@ export namespace BreadcrumbWithOverflow {
             title: any;
         }> | null | undefined)[]>;
         let className: PropTypes.Requireable<string>;
+        let label: PropTypes.Requireable<string>;
         let maxVisible: PropTypes.Requireable<number>;
         let noTrailingSlash: PropTypes.Requireable<boolean>;
         let overflowAriaLabel: any;

package/lib/components/BreadcrumbWithOverflow/BreadcrumbWithOverflow.js

@@ -20,7 +20,7 @@ require('../../global/js/utils/props-helper.js');
 var TooltipTrigger = require('../TooltipTrigger/TooltipTrigger.js');
 
 var _TooltipTrigger;
-var _excluded = ["breadcrumbs", "className", "maxVisible", "noTrailingSlash", "overflowAriaLabel", "overflowTooltipAlign"],
+var _excluded = ["breadcrumbs", "className", "label", "maxVisible", "noTrailingSlash", "overflowAriaLabel", "overflowTooltipAlign"],
   _excluded2 = ["label", "key", "title", "id", "shortTitle"],
   _excluded3 = ["className", "key", "label", "shortTitle", "title"];
 
@@ -37,6 +37,7 @@ exports.BreadcrumbWithOverflow = function BreadcrumbWithOverflow(_ref) {
   var _backItem, _backItem2, _backItem3;
   var breadcrumbs = _ref.breadcrumbs,
     className = _ref.className,
+    label = _ref.label,
     maxVisible = _ref.maxVisible,
     noTrailingSlash = _ref.noTrailingSlash,
     overflowAriaLabel = _ref.overflowAriaLabel,
@@ -95,7 +96,9 @@ exports.BreadcrumbWithOverflow = function BreadcrumbWithOverflow(_ref) {
       className: "".concat(blockClass, "__breadcrumb-container ").concat(blockClass, "__breadcrumb-container--hidden"),
       "aria-hidden": true,
       ref: sizingContainerRef
-    }, /*#__PURE__*/React.createElement(react.Breadcrumb, null, /*#__PURE__*/React.createElement(react.BreadcrumbItem, {
+    }, /*#__PURE__*/React.createElement(react.Breadcrumb, {
+      "aria-label": "".concat(label, "-hidden")
+    }, /*#__PURE__*/React.createElement(react.BreadcrumbItem, {
       key: "".concat(blockClass, "-hidden-overflow-").concat(internalId)
     }, /*#__PURE__*/React.createElement(react.OverflowMenu, {
       "aria-label": overflowAriaLabel,
@@ -119,7 +122,7 @@ exports.BreadcrumbWithOverflow = function BreadcrumbWithOverflow(_ref) {
         title: title !== null && title !== void 0 ? title : label
       }), label);
     }))));
-  }, [breadcrumbs, overflowAriaLabel]);
+  }, [breadcrumbs, label, overflowAriaLabel]);
   React.useEffect(function () {
     // updates displayedBreadcrumbItems and overflowBreadcrumbItems based on displayCount and breadcrumbs
     /* istanbul ignore if */
@@ -261,6 +264,7 @@ exports.BreadcrumbWithOverflow = function BreadcrumbWithOverflow(_ref) {
   }, /*#__PURE__*/React.createElement("div", {
     className: cx(["".concat(blockClass, "__space")])
   }, hiddenSizingItems, /*#__PURE__*/React.createElement(react.Breadcrumb, _rollupPluginBabelHelpers.extends({
+    "aria-label": label,
     className: cx("".concat(blockClass, "__breadcrumb-container"), _rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "__breadcrumb-container-with-items"), displayedBreadcrumbItems.length > 1)),
     noTrailingSlash: noTrailingSlash
   }, other), ((_backItem = backItem) === null || _backItem === void 0 ? void 0 : _backItem.href) && (((_backItem2 = backItem) === null || _backItem2 === void 0 ? void 0 : _backItem2.label) || ((_backItem3 = backItem) === null || _backItem3 === void 0 ? void 0 : _backItem3.title)) && /*#__PURE__*/React.createElement(react.BreadcrumbItem, {
@@ -315,6 +319,10 @@ exports.BreadcrumbWithOverflow.propTypes = {
    * className
    */
   className: index.default.string,
+  /**
+   * Label for the Breadcrumb component
+   */
+  label: index.default.string,
   /**
    * maxVisible: maximum visible breadcrumb-items before overflow is used (values less than 1 are treated as 1)
    */

package/lib/components/Checklist/Checklist.js

@@ -47,8 +47,7 @@ var defaults = {
   enableToggle: true,
   taskLists: [],
   theme: Checklist_types.Themes.light,
-  toggleLabel: 'Toggle',
-  toggleLabelAlign: 'top'
+  toggleLabel: 'Toggle'
 };
 
 /**
@@ -81,7 +80,7 @@ exports.Checklist = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     _ref$toggleLabel = _ref.toggleLabel,
     toggleLabel = _ref$toggleLabel === void 0 ? defaults.toggleLabel : _ref$toggleLabel,
     _ref$toggleLabelAlign = _ref.toggleLabelAlign,
-    toggleLabelAlign = _ref$toggleLabelAlign === void 0 ? defaults.toggleLabelAlign : _ref$toggleLabelAlign,
+    toggleLabelAlign = _ref$toggleLabelAlign === void 0 ? 'top' : _ref$toggleLabelAlign,
     viewAllLabel = _ref.viewAllLabel,
     rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
   var _useState = React.useState(open),

package/lib/components/CoachmarkBeacon/CoachmarkBeacon.js

@@ -47,10 +47,10 @@ exports.CoachmarkBeacon = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     tabIndex: 0,
     type: "button"
   }, coachmark.buttonProps, {
-    "aria-label": label,
     className: "".concat(blockClass, "__target")
   }), /*#__PURE__*/React.createElement("svg", {
-    className: "".concat(blockClass, "__center")
+    className: "".concat(blockClass, "__center"),
+    "aria-label": label
   }, /*#__PURE__*/React.createElement("title", null, label), _circle || (_circle = /*#__PURE__*/React.createElement("circle", {
     r: 1,
     cx: 38,

package/lib/components/CreateFullPage/CreateFullPage.d.ts

@@ -90,6 +90,11 @@ type CreateFullPageBaseProps = {
      * A prop to omit the trailing slash for the breadcrumbs
      */
     noTrailingSlash?: boolean;
+    /**
+     * onChange event for Progress Indicator in the Influencer
+     * @param data step index
+     */
+    onClickInfluencerStep?: (data: number) => void;
     /**
      * An optional handler that is called when the user closes the full page (by
      * clicking the secondary button, located in the modal, which triggers after

package/lib/components/CreateFullPage/CreateFullPage.js

@@ -25,7 +25,7 @@ var useResetCreateComponent = require('../../global/js/hooks/useResetCreateCompo
 var useCreateComponentStepChange = require('../../global/js/hooks/useCreateComponentStepChange.js');
 var CreateInfluencer = require('../CreateInfluencer/CreateInfluencer.js');
 
-var _excluded = ["breadcrumbsOverflowAriaLabel", "breadcrumbs", "backButtonText", "cancelButtonText", "children", "className", "initialStep", "maxVisibleBreadcrumbs", "modalDangerButtonText", "modalDescription", "modalSecondaryButtonText", "modalTitle", "nextButtonText", "onClose", "onRequestSubmit", "firstFocusElement", "submitButtonText", "noTrailingSlash", "title", "secondaryTitle", "breadcrumbOverflowTooltipAlign"];
+var _excluded = ["breadcrumbsOverflowAriaLabel", "breadcrumbs", "backButtonText", "cancelButtonText", "children", "className", "initialStep", "maxVisibleBreadcrumbs", "modalDangerButtonText", "modalDescription", "modalSecondaryButtonText", "modalTitle", "nextButtonText", "onClickInfluencerStep", "onClose", "onRequestSubmit", "firstFocusElement", "submitButtonText", "noTrailingSlash", "title", "secondaryTitle", "breadcrumbOverflowTooltipAlign"];
 var blockClass = "".concat(settings.pkg.prefix, "--create-full-page");
 var componentName = 'CreateFullPage';
 
@@ -63,6 +63,7 @@ exports.CreateFullPage = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     modalSecondaryButtonText = _ref.modalSecondaryButtonText,
     modalTitle = _ref.modalTitle,
     nextButtonText = _ref.nextButtonText,
+    onClickInfluencerStep = _ref.onClickInfluencerStep,
     onClose = _ref.onClose,
     onRequestSubmit = _ref.onRequestSubmit,
     firstFocusElement = _ref.firstFocusElement,
@@ -104,24 +105,28 @@ exports.CreateFullPage = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     setIsDisabled = _useState12[1];
   var _useState13 = React.useState(),
     _useState14 = _rollupPluginBabelHelpers.slicedToArray(_useState13, 2),
-    onNext = _useState14[0],
-    _setOnNext = _useState14[1];
+    onPrevious = _useState14[0],
+    _setOnPrevious = _useState14[1];
   var _useState15 = React.useState(),
     _useState16 = _rollupPluginBabelHelpers.slicedToArray(_useState15, 2),
-    onMount = _useState16[0],
-    _setOnMount = _useState16[1];
-  var _useState17 = React.useState([]),
+    onNext = _useState16[0],
+    _setOnNext = _useState16[1];
+  var _useState17 = React.useState(),
     _useState18 = _rollupPluginBabelHelpers.slicedToArray(_useState17, 2),
-    stepData = _useState18[0],
-    setStepData = _useState18[1];
-  var _useState19 = React.useState(1),
+    onMount = _useState18[0],
+    _setOnMount = _useState18[1];
+  var _useState19 = React.useState([]),
     _useState20 = _rollupPluginBabelHelpers.slicedToArray(_useState19, 2),
-    firstIncludedStep = _useState20[0],
-    setFirstIncludedStep = _useState20[1];
-  var _useState21 = React.useState(),
+    stepData = _useState20[0],
+    setStepData = _useState20[1];
+  var _useState21 = React.useState(1),
     _useState22 = _rollupPluginBabelHelpers.slicedToArray(_useState21, 2),
-    lastIncludedStep = _useState22[0],
-    setLastIncludedStep = _useState22[1];
+    firstIncludedStep = _useState22[0],
+    setFirstIncludedStep = _useState22[1];
+  var _useState23 = React.useState(),
+    _useState24 = _rollupPluginBabelHelpers.slicedToArray(_useState23, 2),
+    lastIncludedStep = _useState24[0],
+    setLastIncludedStep = _useState24[1];
   React.useEffect(function () {
     var firstItem = stepData.findIndex(function (item) {
       return item === null || item === void 0 ? void 0 : item.shouldIncludeStep;
@@ -163,6 +168,7 @@ exports.CreateFullPage = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     firstIncludedStep: firstIncludedStep,
     lastIncludedStep: lastIncludedStep,
     stepData: stepData,
+    onPrevious: onPrevious,
     onNext: onNext,
     isSubmitDisabled: isDisabled,
     setCurrentStep: setCurrentStep,
@@ -203,7 +209,8 @@ exports.CreateFullPage = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   }, /*#__PURE__*/React.createElement(CreateInfluencer.CreateInfluencer, {
     stepData: stepData,
     currentStep: currentStep,
-    title: secondaryTitle
+    title: secondaryTitle,
+    onClickStep: onClickInfluencerStep
   })), /*#__PURE__*/React.createElement("div", {
     className: "".concat(blockClass, "__body")
   }, /*#__PURE__*/React.createElement("div", {
@@ -217,6 +224,11 @@ exports.CreateFullPage = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     value: {
       currentStep: currentStep,
       setIsDisabled: setIsDisabled,
+      setOnPrevious: function setOnPrevious(fn) {
+        return _setOnPrevious(function () {
+          return fn;
+        });
+      },
       setOnNext: function setOnNext(fn) {
         return _setOnNext(function () {
           return fn;
@@ -348,6 +360,10 @@ exports.CreateFullPage.propTypes = {
    * A prop to omit the trailing slash for the breadcrumbs
    */
   noTrailingSlash: index.default.bool,
+  /**
+   * onChange event for Progress Indicator in the Influencer
+   */
+  onClickInfluencerStep: index.default.func,
   /**
    * An optional handler that is called when the user closes the full page (by
    * clicking the secondary button, located in the modal, which triggers after

package/lib/components/CreateFullPage/CreateFullPageStep.d.ts

@@ -46,6 +46,10 @@ interface CreateFullPageStepBaseProps extends PropsWithChildren {
      * This function can _optionally_ return a promise that is either resolved or rejected and the CreateFullPage will handle the submitting state of the next button.
      */
     onNext?: () => void | Promise<any>;
+    /**
+     * Optional function to be called when you move to the previous step.
+     */
+    onPrevious?: () => void;
     /**
      * Sets the optional secondary label on the progress step component
      */

package/lib/components/CreateFullPage/CreateFullPageStep.js

@@ -18,7 +18,7 @@ var pconsole = require('../../global/js/utils/pconsole.js');
 var usePreviousValue = require('../../global/js/hooks/usePreviousValue.js');
 var useRetrieveStepData = require('../../global/js/hooks/useRetrieveStepData.js');
 
-var _excluded = ["children", "className", "subtitle", "description", "disableSubmit", "includeStep", "introStep", "invalid", "title", "hasFieldset", "fieldsetLegendText", "onNext", "onMount", "secondaryLabel"];
+var _excluded = ["children", "className", "subtitle", "description", "disableSubmit", "includeStep", "introStep", "invalid", "title", "hasFieldset", "fieldsetLegendText", "onNext", "onPrevious", "onMount", "secondaryLabel"];
 var componentName = 'CreateFullPageStep';
 var blockClass = "".concat(settings.pkg.prefix, "--create-full-page__step");
 
@@ -45,6 +45,7 @@ exports.CreateFullPageStep = /*#__PURE__*/React.forwardRef(function (_ref, ref)
     hasFieldset = _ref.hasFieldset,
     fieldsetLegendText = _ref.fieldsetLegendText,
     onNext = _ref.onNext,
+    onPrevious = _ref.onPrevious,
     onMount = _ref.onMount,
     secondaryLabel = _ref.secondaryLabel,
     rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
@@ -84,8 +85,9 @@ exports.CreateFullPageStep = /*#__PURE__*/React.forwardRef(function (_ref, ref)
     if (stepNumber === (stepsContext === null || stepsContext === void 0 ? void 0 : stepsContext.currentStep)) {
       stepsContext.setIsDisabled(disableSubmit);
       stepsContext === null || stepsContext === void 0 || stepsContext.setOnNext(onNext); // needs to be updated here otherwise there could be stale state values from only initially setting onNext
+      stepsContext === null || stepsContext === void 0 || stepsContext.setOnPrevious(onPrevious);
     }
-  }, [stepsContext, stepNumber, disableSubmit, onNext]);
+  }, [stepsContext, stepNumber, disableSubmit, onNext, onPrevious]);
   var span = {
     span: 50
   }; // Half.
@@ -178,6 +180,10 @@ exports.CreateFullPageStep.propTypes = {
    * This function can _optionally_ return a promise that is either resolved or rejected and the CreateFullPage will handle the submitting state of the next button.
    */
   onNext: index.default.func,
+  /**
+   * Optional function to be called when you move to the previous step.
+   */
+  onPrevious: index.default.func,
   /**
    * Sets the optional secondary label on the progress step component
    */

package/lib/components/CreateInfluencer/CreateInfluencer.d.ts

@@ -22,6 +22,10 @@ interface CreateInfluencerProps {
      * Provide the current step number.
      */
     currentStep: number;
+    /**
+     * onChange event for Progress Indicator
+     */
+    onClickStep?: (step: number) => void;
     /**
      * Provide the Set Data.
      */
@@ -32,7 +36,7 @@ interface CreateInfluencerProps {
     title?: string | undefined;
 }
 export declare const CreateInfluencer: {
-    ({ className, currentStep, stepData, title, }: PropsWithChildren<CreateInfluencerProps>): React.JSX.Element;
+    ({ className, currentStep, onClickStep, stepData, title, }: PropsWithChildren<CreateInfluencerProps>): React.JSX.Element;
     displayName: string;
     propTypes: {
         /**
@@ -43,6 +47,10 @@ export declare const CreateInfluencer: {
          * Used to mark the current step on the ProgressIndicator component
          */
         currentStep: PropTypes.Validator<number>;
+        /**
+         * onChange event for Progress Indicator
+         */
+        onClickStep: PropTypes.Requireable<(...args: any[]) => any>;
         /**
          * The step data that renders the progress items
          */

package/lib/components/CreateInfluencer/CreateInfluencer.js

@@ -22,6 +22,7 @@ var componentName = 'CreateInfluencer';
 var CreateInfluencer = function CreateInfluencer(_ref) {
   var className = _ref.className,
     currentStep = _ref.currentStep,
+    onClickStep = _ref.onClickStep,
     stepData = _ref.stepData,
     title = _ref.title;
   var getNumberOfDynamicStepsBeforeCurrentStep = function getNumberOfDynamicStepsBeforeCurrentStep(array, key) {
@@ -59,10 +60,11 @@ var CreateInfluencer = function CreateInfluencer(_ref) {
       ,
       spaceEqually: true,
       vertical: true,
-      className: cx("".concat(blockClass, "__progress-indicator"))
+      className: cx("".concat(blockClass, "__progress-indicator")),
+      onChange: onClickStep
     }, progressSteps.map(function (step, stepIndex) {
       return /*#__PURE__*/React.createElement(react.ProgressStep, {
-        label: step.title,
+        label: step === null || step === void 0 ? void 0 : step.title,
         key: stepIndex,
         secondaryLabel: step.secondaryLabel || undefined,
         invalid: step.invalid
@@ -86,6 +88,10 @@ CreateInfluencer.propTypes = {
    * Used to mark the current step on the ProgressIndicator component
    */
   currentStep: index.default.number.isRequired,
+  /**
+   * onChange event for Progress Indicator
+   */
+  onClickStep: index.default.func,
   /**
    * The step data that renders the progress items
    */

package/lib/components/CreateModal/CreateModal.d.ts

@@ -58,7 +58,7 @@ export interface CreateModalProps extends React.ComponentProps<typeof ComposedMo
     /**
      * Specifies which DOM element in the form should be focused.
      */
-    selectorPrimaryFocus: ReactNode;
+    selectorPrimaryFocus: string;
 }
 /**
  * The `CreateModal` component provides a way for a user to quickly generate a new
@@ -68,4 +68,4 @@ immediately apparent to the user, with a clear and obvious path to completion.
  */
 export declare let CreateModal: React.ForwardRefExoticComponent<CreateModalProps & {
     children?: React.ReactNode;
-} & React.RefAttributes<unknown>>;
+} & React.RefAttributes<HTMLDivElement>>;

package/lib/components/CreateModal/CreateModal.js

@@ -138,7 +138,7 @@ exports.CreateModal.propTypes = {
   /**
    * Specifies which DOM element in the form should be focused.
    */
-  selectorPrimaryFocus: index.default.node.isRequired,
+  selectorPrimaryFocus: index.default.string.isRequired,
   /**
    * The subtitle of the CreateModal is optional and serves to provide more information about the modal.
    */

package/lib/components/Datagrid/Datagrid/DatagridSelectAll.js

@@ -72,6 +72,7 @@ var SelectAll = function SelectAll(datagridState) {
     return onChange === null || onChange === void 0 ? void 0 : onChange(event);
   };
   return /*#__PURE__*/React.createElement(react.TableSelectAll, _rollupPluginBabelHelpers.extends({}, selectProps, {
+    checked: (selectProps === null || selectProps === void 0 ? void 0 : selectProps.checked) || false,
     className: cx("".concat(blockClass, "__head-select-all"), "".concat(blockClass, "__checkbox-cell"), _rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "__checkbox-cell-sticky-left"), /* istanbul ignore next */
     isFirstColumnStickyLeft && Number(windowSize) > 671)),
     name: "".concat(tableId, "-select-all-checkbox-name"),

package/lib/components/Datagrid/Datagrid/addons/RowSize/RowSizeDropdown.d.ts

@@ -1,12 +1,14 @@
 export default RowSizeDropdown;
-declare function RowSizeDropdown({ align, legendText, ...props }: {
+declare function RowSizeDropdown({ align, legendText, autoAlign, ...props }: {
     [x: string]: any;
     align?: string | undefined;
     legendText?: string | undefined;
+    autoAlign: any;
 }): React.JSX.Element;
 declare namespace RowSizeDropdown {
     namespace propTypes {
         let align: any;
+        let autoAlign: PropTypes.Requireable<boolean>;
         let datagridName: PropTypes.Requireable<string>;
         let legendText: PropTypes.Requireable<string>;
         let light: PropTypes.Requireable<boolean>;