@carbon/ibm-products 2.43.2-canary.32 → 2.43.2-canary.321

package/lib/components/CreateTearsheet/CreateTearsheet.d.ts

@@ -4,9 +4,11 @@
  * 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, { ReactNode, PropsWithChildren, Dispatch, SetStateAction } from 'react';
+import React, { Dispatch, PropsWithChildren, ReactNode, SetStateAction } from 'react';
+import { ExperimentalSecondarySubmit } from './CreateTearsheetStep';
 export interface StepsContextType {
     currentStep: number;
+    setExperimentalSecondarySubmit: Dispatch<SetStateAction<ExperimentalSecondarySubmit>>;
     setIsDisabled: Dispatch<SetStateAction<boolean>>;
     setOnPrevious: (fn: any) => void;
     setOnNext: (fn: any) => void;
@@ -16,7 +18,7 @@ export interface StepsContextType {
 }
 export declare const StepsContext: React.Context<StepsContextType | null>;
 export declare const StepNumberContext: React.Context<number>;
-interface CreateTearsheetProps extends PropsWithChildren {
+export interface CreateTearsheetProps extends PropsWithChildren {
     /**
      * The back button text
      */
@@ -32,6 +34,10 @@ interface CreateTearsheetProps extends PropsWithChildren {
      * An optional class or classes to be added to the outermost element.
      */
     className?: string;
+    /**
+     * The experimentalSecondary submit button text
+     */
+    experimentalSecondarySubmitText?: string;
     /**
      * A description of the flow, displayed in the header area of the tearsheet.
      */

package/lib/components/CreateTearsheet/CreateTearsheet.js

@@ -7,18 +7,16 @@
 
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
-
 var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
 var React = require('react');
-var index = require('../../node_modules/prop-types/index.js');
-var cx = require('classnames');
 var react = require('@carbon/react');
+var index = require('../../_virtual/index.js');
 var TearsheetShell = require('../Tearsheet/TearsheetShell.js');
-var settings = require('../../settings.js');
+var cx = require('classnames');
 var devtools = require('../../global/js/utils/devtools.js');
-var lastIndexInArray = require('../../global/js/utils/lastIndexInArray.js');
 var getNumberOfHiddenSteps = require('../../global/js/utils/getNumberOfHiddenSteps.js');
+var lastIndexInArray = require('../../global/js/utils/lastIndexInArray.js');
+var settings = require('../../settings.js');
 var usePreviousValue = require('../../global/js/hooks/usePreviousValue.js');
 var useCreateComponentFocus = require('../../global/js/hooks/useCreateComponentFocus.js');
 var useValidCreateStepCount = require('../../global/js/hooks/useValidCreateStepCount.js');
@@ -26,12 +24,7 @@ var useResetCreateComponent = require('../../global/js/hooks/useResetCreateCompo
 var useCreateComponentStepChange = require('../../global/js/hooks/useCreateComponentStepChange.js');
 var CreateInfluencer = require('../CreateInfluencer/CreateInfluencer.js');
 
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
-
-var _excluded = ["backButtonText", "cancelButtonText", "children", "className", "description", "influencerWidth", "initialStep", "label", "nextButtonText", "onClose", "onRequestSubmit", "open", "firstFocusElement", "slug", "submitButtonText", "title", "verticalPosition"];
+var _excluded = ["backButtonText", "cancelButtonText", "children", "className", "experimentalSecondarySubmitText", "description", "influencerWidth", "initialStep", "label", "nextButtonText", "onClose", "onRequestSubmit", "open", "firstFocusElement", "slug", "submitButtonText", "title", "verticalPosition"];
 var componentName = 'CreateTearsheet';
 var blockClass = "".concat(settings.pkg.prefix, "--tearsheet-create");
 
@@ -49,6 +42,7 @@ exports.CreateTearsheet = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     cancelButtonText = _ref.cancelButtonText,
     children = _ref.children,
     className = _ref.className,
+    experimentalSecondarySubmitText = _ref.experimentalSecondarySubmitText,
     description = _ref.description,
     _ref$influencerWidth = _ref.influencerWidth,
     influencerWidth = _ref$influencerWidth === void 0 ? 'narrow' : _ref$influencerWidth,
@@ -113,6 +107,10 @@ exports.CreateTearsheet = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     _useState24 = _rollupPluginBabelHelpers.slicedToArray(_useState23, 2),
     lastIncludedStep = _useState24[0],
     setLastIncludedStep = _useState24[1];
+  var _useState25 = React.useState({}),
+    _useState26 = _rollupPluginBabelHelpers.slicedToArray(_useState25, 2),
+    experimentalSecondarySubmit = _useState26[0],
+    setExperimentalSecondarySubmit = _useState26[1];
   var previousState = usePreviousValue.usePreviousValue({
     currentStep: currentStep,
     open: open
@@ -120,10 +118,11 @@ exports.CreateTearsheet = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var contentRef = React.useRef(null);
   React.useEffect(function () {
     var firstItem = stepData.findIndex(function (item) {
-      return item === null || item === void 0 ? void 0 : item.shouldIncludeStep;
+      return item.shouldIncludeStep === true;
     }) + 1;
     var lastItem = lastIndexInArray.lastIndexInArray(stepData, 'shouldIncludeStep', true);
     if (firstItem !== firstIncludedStep) {
+      setCurrentStep(firstItem);
       setFirstIncludedStep(firstItem);
     }
     if (lastItem !== lastIncludedStep) {
@@ -132,10 +131,8 @@ exports.CreateTearsheet = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     if (open && initialStep) {
       var numberOfHiddenSteps = getNumberOfHiddenSteps.getNumberOfHiddenSteps(stepData, initialStep);
       setCurrentStep(Number(initialStep + numberOfHiddenSteps));
-    } else {
-      setCurrentStep(firstIncludedStep);
     }
-  }, [stepData, firstIncludedStep, lastIncludedStep, initialStep, open]);
+  }, [firstIncludedStep, initialStep, lastIncludedStep, open, stepData]);
   useCreateComponentFocus.useCreateComponentFocus({
     previousState: previousState,
     currentStep: currentStep,
@@ -180,14 +177,16 @@ exports.CreateTearsheet = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     nextButtonText: nextButtonText,
     isSubmitting: isSubmitting,
     componentBlockClass: blockClass,
+    experimentalSecondarySubmit: experimentalSecondarySubmit,
+    experimentalSecondarySubmitText: experimentalSecondarySubmit.labelText ? experimentalSecondarySubmit.labelText : experimentalSecondarySubmitText,
     setCreateComponentActions: setCreateTearsheetActions
   });
-  return /*#__PURE__*/React__default["default"].createElement(TearsheetShell.TearsheetShell, _rollupPluginBabelHelpers["extends"]({}, devtools.getDevtoolsProps(componentName), rest, {
+  return /*#__PURE__*/React.createElement(TearsheetShell.TearsheetShell, _rollupPluginBabelHelpers.extends({}, devtools.getDevtoolsProps(componentName), rest, {
     ref: ref,
     actions: createTearsheetActions,
-    className: cx__default["default"](blockClass, className),
+    className: cx(blockClass, className),
     description: description,
-    influencer: /*#__PURE__*/React__default["default"].createElement(CreateInfluencer.CreateInfluencer, {
+    influencer: /*#__PURE__*/React.createElement(CreateInfluencer.CreateInfluencer, {
       currentStep: currentStep,
       stepData: stepData
     }),
@@ -200,14 +199,15 @@ exports.CreateTearsheet = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     title: title,
     verticalPosition: verticalPosition,
     closeIconDescription: ''
-  }), /*#__PURE__*/React__default["default"].createElement("div", {
+  }), /*#__PURE__*/React.createElement("div", {
     className: "".concat(blockClass, "__content"),
     ref: contentRef
-  }, /*#__PURE__*/React__default["default"].createElement(react.Form, {
+  }, /*#__PURE__*/React.createElement(react.Form, {
     "aria-label": title
-  }, /*#__PURE__*/React__default["default"].createElement(StepsContext.Provider, {
+  }, /*#__PURE__*/React.createElement(StepsContext.Provider, {
     value: {
       currentStep: currentStep,
+      setExperimentalSecondarySubmit: setExperimentalSecondarySubmit,
       setIsDisabled: setIsDisabled,
       setOnPrevious: function setOnPrevious(fn) {
         return _setOnPrevious(function () {
@@ -227,8 +227,8 @@ exports.CreateTearsheet = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
       setStepData: setStepData,
       stepData: stepData
     }
-  }, React__default["default"].Children.map(children, function (child, index) {
-    return /*#__PURE__*/React__default["default"].createElement(StepNumberContext.Provider, {
+  }, React.Children.map(children, function (child, index) {
+    return /*#__PURE__*/React.createElement(StepNumberContext.Provider, {
       value: index + 1
     }, child);
   })))));
@@ -247,74 +247,78 @@ exports.CreateTearsheet.propTypes = {
   /**
    * The back button text
    */
-  backButtonText: index["default"].string.isRequired,
+  backButtonText: index.default.string.isRequired,
   /**
    * The cancel button text
    */
-  cancelButtonText: index["default"].string.isRequired,
+  cancelButtonText: index.default.string.isRequired,
   /**
    * The main content of the tearsheet
    */
-  children: index["default"].node,
+  children: index.default.node,
   /**
    * An optional class or classes to be added to the outermost element.
    */
-  className: index["default"].string,
+  className: index.default.string,
   /**
    * A description of the flow, displayed in the header area of the tearsheet.
    */
-  description: index["default"].node,
+  description: index.default.node,
+  /**
+   * The experimentalSecondary submit button text
+   */
+  experimentalSecondarySubmitText: index.default.string,
   /**
    * Specifies elements to focus on first on render.
    */
-  firstFocusElement: index["default"].string,
+  firstFocusElement: index.default.string,
   /**
    * Used to set the size of the influencer
    */
-  influencerWidth: index["default"].oneOf(['narrow', 'wide']),
+  influencerWidth: index.default.oneOf(['narrow', 'wide']),
   /**
    * This can be used to open the component to a step other than the first step.
    * For example, a create flow was previously in progress, data was saved, and
    * is now being completed.
    */
-  initialStep: index["default"].number,
+  initialStep: index.default.number,
   /**
    * A label for the tearsheet, displayed in the header area of the tearsheet
    * to maintain context for the tearsheet (e.g. as the title changes from page
    * to page of a multi-page task).
    */
-  label: index["default"].node,
+  label: index.default.node,
   /**
    * The next button text
    */
-  nextButtonText: index["default"].string.isRequired,
+  nextButtonText: index.default.string.isRequired,
   /**
    * An optional handler that is called when the user closes the tearsheet (by
    * clicking the close button, if enabled, or clicking outside, if enabled).
    * Returning `false` here prevents the modal from closing.
    */
-  onClose: index["default"].func,
+  onClose: index.default.func,
   /**
    * Specify a handler for submitting the multi step tearsheet (final step).
    * This function can _optionally_ return a promise that is either resolved or rejected and the CreateTearsheet will handle the submitting state of the create button.
    */
-  onRequestSubmit: index["default"].func.isRequired,
+  onRequestSubmit: index.default.func.isRequired,
   /**
    * Specifies whether the tearsheet is currently open.
    */
-  open: index["default"].bool,
+  open: index.default.bool,
   /**
    *  **Experimental:** Provide a `Slug` component to be rendered inside the `Tearsheet` component
    */
-  slug: index["default"].node,
+  slug: index.default.node,
   /**
    * The submit button text
    */
-  submitButtonText: index["default"].string.isRequired,
+  submitButtonText: index.default.string.isRequired,
   /**
    * The main title of the tearsheet, displayed in the header area.
    */
-  title: index["default"].node,
+  title: index.default.node,
   /**
    * The position of the top of tearsheet in the viewport. The 'normal'
    * position (the default) is a short distance down from the top of the
@@ -322,7 +326,7 @@ exports.CreateTearsheet.propTypes = {
    * from below. The 'lower' position provides a little extra room at the top
    * to allow an action bar navigation or breadcrumbs to also show through.
    */
-  verticalPosition: index["default"].oneOf(['normal', 'lower'])
+  verticalPosition: index.default.oneOf(['normal', 'lower'])
 };
 
 exports.StepNumberContext = StepNumberContext;

package/lib/components/CreateTearsheet/CreateTearsheetDivider.js

@@ -7,28 +7,21 @@
 
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
-
 var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
 var React = require('react');
-var index = require('../../node_modules/prop-types/index.js');
+var index = require('../../_virtual/index.js');
 var cx = require('classnames');
 var settings = require('../../settings.js');
 
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
-
 var _excluded = ["className"];
 var componentName = 'CreateTearsheetDivider';
 var blockClass = "".concat(settings.pkg.prefix, "--tearsheet-create__section--divider");
 exports.CreateTearsheetDivider = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var className = _ref.className,
     rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
-  return /*#__PURE__*/React__default["default"].createElement("span", _rollupPluginBabelHelpers["extends"]({}, rest, {
+  return /*#__PURE__*/React.createElement("span", _rollupPluginBabelHelpers.extends({}, rest, {
     ref: ref,
-    className: cx__default["default"](blockClass, className)
+    className: cx(blockClass, className)
   }));
 });
 
@@ -38,5 +31,5 @@ exports.CreateTearsheetDivider.propTypes = {
   /**
    * Sets an optional className to be added to the tearsheet divider
    */
-  className: index["default"].string
+  className: index.default.string
 };

package/lib/components/CreateTearsheet/CreateTearsheetStep.d.ts

@@ -49,6 +49,10 @@ interface CreateTearsheetStepBaseProps extends PropsWithChildren {
      * This will conditionally disable the submit button in the multi step Tearsheet
      */
     disableSubmit?: boolean;
+    /**
+     * Configuration options for customizing the behavior of the experimentalSecondary submit button.
+     */
+    experimentalSecondarySubmit?: ExperimentalSecondarySubmit;
     /**
      * This prop is used to help track dynamic steps. If this value is `false` then the step is not included in the visible steps or the ProgressIndicator
      * steps. If this value is `true` then the step will be included in the list of visible steps, as well as being included in the ProgressIndicator step list
@@ -91,5 +95,19 @@ interface CreateTearsheetStepBaseProps extends PropsWithChildren {
     title: React.ReactNode;
 }
 type CreateTearsheetStepProps = CreateTearsheetStepBaseProps & fieldsetLegendTextProps;
+/**
+ * Configuration options for customizing the behavior of the experimentalSecondary submit button.
+ *
+ * @property {string} [labelText] - Optional text to replace the default button text.
+ * @property {boolean} [disabled] - If true, the button will be disabled and not clickable.
+ * @property {boolean} [hideSecondarySubmit] - If true, the button will be hidden from view.
+ * @property {() => void} [onClick] - Optional click handler function to be executed when the button is clicked.
+ */
+export type ExperimentalSecondarySubmit = {
+    labelText?: string;
+    disabled?: boolean;
+    hideSecondarySubmit?: boolean;
+    onClick?: () => void;
+};
 export declare let CreateTearsheetStep: React.ForwardRefExoticComponent<CreateTearsheetStepProps & React.RefAttributes<unknown>>;
 export {};

package/lib/components/CreateTearsheet/CreateTearsheetStep.js

@@ -7,11 +7,9 @@
 
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
-
 var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
 var React = require('react');
-var index = require('../../node_modules/prop-types/index.js');
+var index = require('../../_virtual/index.js');
 var cx = require('classnames');
 var react = require('@carbon/react');
 var CreateTearsheet = require('./CreateTearsheet.js');
@@ -20,12 +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');
 
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
-
-var _excluded = ["children", "className", "description", "disableSubmit", "fieldsetLegendText", "hasFieldset", "includeStep", "introStep", "invalid", "onMount", "onNext", "onPrevious", "secondaryLabel", "subtitle", "title"];
+var _excluded = ["children", "className", "description", "disableSubmit", "experimentalSecondarySubmit", "fieldsetLegendText", "hasFieldset", "includeStep", "introStep", "invalid", "onMount", "onNext", "onPrevious", "secondaryLabel", "subtitle", "title"];
 var componentName = 'CreateTearsheetStep';
 var blockClass = "".concat(settings.pkg.prefix, "--tearsheet-create__step");
 
@@ -34,11 +27,22 @@ var defaults = {
   hasFieldset: true,
   includeStep: true
 };
+
+/**
+ * Configuration options for customizing the behavior of the experimentalSecondary submit button.
+ *
+ * @property {string} [labelText] - Optional text to replace the default button text.
+ * @property {boolean} [disabled] - If true, the button will be disabled and not clickable.
+ * @property {boolean} [hideSecondarySubmit] - If true, the button will be hidden from view.
+ * @property {() => void} [onClick] - Optional click handler function to be executed when the button is clicked.
+ */
+
 exports.CreateTearsheetStep = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var children = _ref.children,
     className = _ref.className,
     description = _ref.description,
     disableSubmit = _ref.disableSubmit,
+    experimentalSecondarySubmit = _ref.experimentalSecondarySubmit,
     fieldsetLegendText = _ref.fieldsetLegendText,
     _ref$hasFieldset = _ref.hasFieldset,
     hasFieldset = _ref$hasFieldset === void 0 ? defaults.hasFieldset : _ref$hasFieldset,
@@ -80,8 +84,9 @@ exports.CreateTearsheetStep = /*#__PURE__*/React.forwardRef(function (_ref, ref)
   React.useEffect(function () {
     if (stepNumber === (stepsContext === null || stepsContext === void 0 ? void 0 : stepsContext.currentStep) && (previousState === null || previousState === void 0 ? void 0 : previousState.currentStep) !== (stepsContext === null || stepsContext === void 0 ? void 0 : stepsContext.currentStep)) {
       stepsContext === null || stepsContext === void 0 || stepsContext.setOnMount(onMount);
+      stepsContext === null || stepsContext === void 0 || stepsContext.setExperimentalSecondarySubmit(_rollupPluginBabelHelpers.objectSpread2({}, experimentalSecondarySubmit));
     }
-  }, [onMount, stepsContext, stepNumber, previousState === null || previousState === void 0 ? void 0 : previousState.currentStep]);
+  }, [onMount, experimentalSecondarySubmit, stepsContext, stepNumber, previousState === null || previousState === void 0 ? void 0 : previousState.currentStep]);
 
   // Used to take the `includeStep` prop and use it as a local state value
   React.useEffect(function () {
@@ -120,37 +125,37 @@ exports.CreateTearsheetStep = /*#__PURE__*/React.forwardRef(function (_ref, ref)
   var renderDescription = function renderDescription() {
     if (description) {
       if (typeof description === 'string') {
-        return /*#__PURE__*/React__default["default"].createElement("p", {
+        return /*#__PURE__*/React.createElement("p", {
           className: "".concat(blockClass, "--description")
         }, description);
       }
       if ( /*#__PURE__*/React.isValidElement(description)) {
-        return /*#__PURE__*/React__default["default"].createElement("div", {
+        return /*#__PURE__*/React.createElement("div", {
           className: "".concat(blockClass, "--description")
         }, description);
       }
     }
     return null;
   };
-  return stepsContext ? /*#__PURE__*/React__default["default"].createElement("div", {
+  return stepsContext ? /*#__PURE__*/React.createElement("div", {
     ref: stepRef
-  }, /*#__PURE__*/React__default["default"].createElement(react.Grid, _rollupPluginBabelHelpers["extends"]({}, rest, {
-    className: cx__default["default"](blockClass, className, _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "__step--hidden-step"), stepNumber !== (stepsContext === null || stepsContext === void 0 ? void 0 : stepsContext.currentStep)), "".concat(blockClass, "__step--visible-step"), stepNumber === (stepsContext === null || stepsContext === void 0 ? void 0 : stepsContext.currentStep)))
-  }), /*#__PURE__*/React__default["default"].createElement(react.Column, {
+  }, /*#__PURE__*/React.createElement(react.Grid, _rollupPluginBabelHelpers.extends({}, rest, {
+    className: cx(blockClass, className, _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "__step--hidden-step"), stepNumber !== (stepsContext === null || stepsContext === void 0 ? void 0 : stepsContext.currentStep)), "".concat(blockClass, "__step--visible-step"), stepNumber === (stepsContext === null || stepsContext === void 0 ? void 0 : stepsContext.currentStep)))
+  }), /*#__PURE__*/React.createElement(react.Column, {
     xlg: 12,
     lg: 12,
     md: 8,
     sm: 4
-  }, /*#__PURE__*/React__default["default"].createElement("h4", {
+  }, /*#__PURE__*/React.createElement("h4", {
     className: "".concat(blockClass, "--title")
-  }, title), subtitle && /*#__PURE__*/React__default["default"].createElement("h6", {
+  }, title), subtitle && /*#__PURE__*/React.createElement("h6", {
     className: "".concat(blockClass, "--subtitle")
-  }, subtitle), renderDescription()), /*#__PURE__*/React__default["default"].createElement(react.Column, {
+  }, subtitle), renderDescription()), /*#__PURE__*/React.createElement(react.Column, {
     span: 100
-  }, hasFieldset ? /*#__PURE__*/React__default["default"].createElement(react.FormGroup, {
+  }, hasFieldset ? /*#__PURE__*/React.createElement(react.FormGroup, {
     legendText: fieldsetLegendText,
     className: "".concat(blockClass, "--fieldset")
-  }, children) : children))) : pconsole["default"].warn("You have tried using a ".concat(componentName, " component outside of a CreateTearsheet. This is not allowed. ").concat(componentName, "s should always be children of the CreateTearsheet"));
+  }, children) : children))) : pconsole.default.warn("You have tried using a ".concat(componentName, " component outside of a CreateTearsheet. This is not allowed. ").concat(componentName, "s should always be children of the CreateTearsheet"));
 });
 
 // Return a placeholder if not released and not enabled by feature flag
@@ -159,26 +164,41 @@ exports.CreateTearsheetStep.propTypes = {
   /**
    * Content that shows in the tearsheet step
    */
-  children: index["default"].node,
+  children: index.default.node,
   /**
    * Sets an optional className to be added to the tearsheet step
    */
-  className: index["default"].string,
+  className: index.default.string,
   /**
    * Sets an optional description on the step component
    */
-  description: index["default"].node,
+  description: index.default.node,
   /**
    * This will conditionally disable the submit button in the multi step Tearsheet
    */
-  disableSubmit: index["default"].bool,
+  disableSubmit: index.default.bool,
+  /**
+   * Configuration options for customizing the behavior of the experimentalSecondary submit button.
+   *
+   * @property {string} [labelText] - Optional text to replace the default button text.
+   * @property {boolean} [disabled] - If true, the button will be disabled and not clickable.
+   * @property {boolean} [hideSecondarySubmit] - If true, the button will be hidden from view.
+   * @property {() => void} [onClick] - Optional click handler function to be executed when the button is clicked.
+   */
+  /**@ts-ignore*/
+  experimentalSecondarySubmit: index.default.shape({
+    labelText: index.default.string,
+    disabled: index.default.bool,
+    hideSecondarySubmit: index.default.bool,
+    onClick: index.default.func
+  }),
   /**
    * This is the required legend text that appears above a fieldset html element for accessibility purposes.
    * You can set the `hasFieldset` prop to false if you have multiple fieldset elements or want to control the children of your Full Page's step content.
    * Otherwise, use CSS to hide/remove this label text.
    */
   /**@ts-ignore*/
-  fieldsetLegendText: index["default"].string.isRequired.if(function (_ref2) {
+  fieldsetLegendText: index.default.string.isRequired.if(function (_ref2) {
     var hasFieldset = _ref2.hasFieldset;
     return !!hasFieldset;
   }),
@@ -188,45 +208,45 @@ exports.CreateTearsheetStep.propTypes = {
    * You can set this prop to `false` if you have multiple fieldset elements or want to control the children of your Full Page's step content.
    */
   /**@ts-ignore*/
-  hasFieldset: index["default"].bool,
+  hasFieldset: index.default.bool,
   /**
    * This prop is used to help track dynamic steps. If this value is `false` then the step is not included in the visible steps or the ProgressIndicator
    * steps. If this value is `true` then the step will be included in the list of visible steps, as well as being included in the ProgressIndicator step list
    */
-  includeStep: index["default"].bool,
+  includeStep: index.default.bool,
   /**
    * This prop can be used on the first step to mark it as an intro step, which will not render the progress indicator steps
    */
-  introStep: index["default"].bool,
+  introStep: index.default.bool,
   /**
    * This optional prop will indicate an error icon on the progress indicator step item
    */
-  invalid: index["default"].bool,
+  invalid: index.default.bool,
   /**
    * Optional function to be called on initial mount of a step.
    * For example, this can be used to fetch data that is required on a particular step.
    */
-  onMount: index["default"].func,
+  onMount: index.default.func,
   /**
    * Optional function to be called when you move to the next step.
    * For example, this can be used to validate input fields before proceeding to the next step.
    * This function can _optionally_ return a promise that is either resolved or rejected and the CreateTearsheet will handle the submitting state of the next button.
    */
-  onNext: index["default"].func,
+  onNext: index.default.func,
   /**
    * Optional function to be called when you move to the previous step.
    */
-  onPrevious: index["default"].func,
+  onPrevious: index.default.func,
   /**
    * Sets the optional secondary label on the progress step component
    */
-  secondaryLabel: index["default"].string,
+  secondaryLabel: index.default.string,
   /**
    * Sets an optional subtitle on the step component
    */
-  subtitle: index["default"].string,
+  subtitle: index.default.string,
   /**
    * Sets the title text for a tearsheet step
    */
-  title: index["default"].node.isRequired
+  title: index.default.node.isRequired
 };

package/lib/components/CreateTearsheet/index.d.ts

@@ -1,3 +1,10 @@
-export { CreateTearsheet } from "./CreateTearsheet";
-export { CreateTearsheetStep } from "./CreateTearsheetStep";
-export { CreateTearsheetDivider } from "./CreateTearsheetDivider";
+/**
+ * Copyright IBM Corp. 2021, 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 { CreateTearsheet } from './CreateTearsheet';
+export { CreateTearsheetStep } from './CreateTearsheetStep';
+export { CreateTearsheetDivider } from './CreateTearsheetDivider';
+export type { CreateTearsheetProps } from './CreateTearsheet';

package/lib/components/CreateTearsheetNarrow/CreateTearsheetNarrow.d.ts

@@ -6,7 +6,7 @@
  */
 import React, { PropsWithChildren, ReactNode } from 'react';
 type VerticalPosition = 'normal' | 'lower';
-interface CreateTearsheetNarrowProps extends PropsWithChildren {
+export interface CreateTearsheetNarrowProps extends PropsWithChildren {
     /**
      * Provide the contents of the CreateTearsheetNarrow.
      */