@carbon/ibm-products 2.43.2-canary.209 → 2.43.2-canary.211

package/es/components/CreateTearsheet/CreateTearsheet.d.ts

@@ -5,8 +5,10 @@
  * LICENSE file in the root directory of this source tree.
  */
 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;
@@ -32,6 +34,10 @@ export 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/es/components/CreateTearsheet/CreateTearsheet.js

@@ -22,7 +22,7 @@ import { useResetCreateComponent } from '../../global/js/hooks/useResetCreateCom
 import { useCreateComponentStepChange } from '../../global/js/hooks/useCreateComponentStepChange.js';
 import { CreateInfluencer } from '../CreateInfluencer/CreateInfluencer.js';
 
-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(pkg.prefix, "--tearsheet-create");
 
@@ -40,6 +40,7 @@ var CreateTearsheet = /*#__PURE__*/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,
@@ -104,6 +105,10 @@ var CreateTearsheet = /*#__PURE__*/forwardRef(function (_ref, ref) {
     _useState24 = _slicedToArray(_useState23, 2),
     lastIncludedStep = _useState24[0],
     setLastIncludedStep = _useState24[1];
+  var _useState25 = useState({}),
+    _useState26 = _slicedToArray(_useState25, 2),
+    experimentalSecondarySubmit = _useState26[0],
+    setExperimentalSecondarySubmit = _useState26[1];
   var previousState = usePreviousValue({
     currentStep: currentStep,
     open: open
@@ -170,6 +175,8 @@ var CreateTearsheet = /*#__PURE__*/forwardRef(function (_ref, ref) {
     nextButtonText: nextButtonText,
     isSubmitting: isSubmitting,
     componentBlockClass: blockClass,
+    experimentalSecondarySubmit: experimentalSecondarySubmit,
+    experimentalSecondarySubmitText: experimentalSecondarySubmit.labelText ? experimentalSecondarySubmit.labelText : experimentalSecondarySubmitText,
     setCreateComponentActions: setCreateTearsheetActions
   });
   return /*#__PURE__*/React__default.createElement(TearsheetShell, _extends({}, getDevtoolsProps(componentName), rest, {
@@ -198,6 +205,7 @@ var CreateTearsheet = /*#__PURE__*/forwardRef(function (_ref, ref) {
   }, /*#__PURE__*/React__default.createElement(StepsContext.Provider, {
     value: {
       currentStep: currentStep,
+      setExperimentalSecondarySubmit: setExperimentalSecondarySubmit,
       setIsDisabled: setIsDisabled,
       setOnPrevious: function setOnPrevious(fn) {
         return _setOnPrevious(function () {
@@ -254,6 +262,10 @@ CreateTearsheet.propTypes = {
    * A description of the flow, displayed in the header area of the tearsheet.
    */
   description: PropTypes.node,
+  /**
+   * The experimentalSecondary submit button text
+   */
+  experimentalSecondarySubmitText: PropTypes.string,
   /**
    * Specifies elements to focus on first on render.
    */

package/es/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/es/components/CreateTearsheet/CreateTearsheetStep.js

@@ -5,7 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, extends as _extends, defineProperty as _defineProperty } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, objectSpread2 as _objectSpread2, extends as _extends, defineProperty as _defineProperty } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import React__default, { forwardRef, useRef, useContext, useState, useEffect, isValidElement } from 'react';
 import PropTypes from '../../node_modules/prop-types/index.js';
 import cx from 'classnames';
@@ -16,7 +16,7 @@ import pconsole from '../../global/js/utils/pconsole.js';
 import { usePreviousValue } from '../../global/js/hooks/usePreviousValue.js';
 import { useRetrieveStepData } from '../../global/js/hooks/useRetrieveStepData.js';
 
-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(pkg.prefix, "--tearsheet-create__step");
 
@@ -25,11 +25,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.
+ */
+
 var CreateTearsheetStep = /*#__PURE__*/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,
@@ -71,8 +82,9 @@ var CreateTearsheetStep = /*#__PURE__*/forwardRef(function (_ref, ref) {
   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(_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
   useEffect(function () {
@@ -163,6 +175,21 @@ CreateTearsheetStep.propTypes = {
    * This will conditionally disable the submit button in the multi step Tearsheet
    */
   disableSubmit: PropTypes.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: PropTypes.shape({
+    labelText: PropTypes.string,
+    disabled: PropTypes.bool,
+    hideSecondarySubmit: PropTypes.bool,
+    onClick: PropTypes.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.

package/es/components/TagSet/TagSet.d.ts

@@ -58,6 +58,10 @@ export interface TagSetProps extends PropsWithChildren {
      * overflowAlign from the standard tooltip. Default center.
      */
     overflowAlign?: OverflowAlign;
+    /**
+     * Will auto-align the popover on first render if it is not visible. This prop is currently experimental and is subject to future changes.
+     */
+    overflowAutoAlign?: boolean;
     /**
      * overflowClassName for the tooltip popup
      */

package/es/components/TagSet/TagSet.js

@@ -17,7 +17,7 @@ import { isRequiredIf } from '../../global/js/utils/props-helper.js';
 import { pkg } from '../../settings.js';
 import { useResizeObserver } from '../../global/js/hooks/useResizeObserver.js';
 
-var _excluded = ["align", "allTagsModalTarget", "className", "maxVisible", "multiline", "overflowAlign", "overflowClassName", "overflowType", "allTagsModalTitle", "allTagsModalSearchLabel", "allTagsModalSearchPlaceholderText", "showAllTagsLabel", "tags", "containingElementRef", "measurementOffset", "onOverflowTagChange"],
+var _excluded = ["align", "allTagsModalTarget", "className", "maxVisible", "multiline", "overflowAutoAlign", "overflowAlign", "overflowClassName", "overflowType", "allTagsModalTitle", "allTagsModalSearchLabel", "allTagsModalSearchPlaceholderText", "showAllTagsLabel", "tags", "containingElementRef", "measurementOffset", "onOverflowTagChange"],
   _excluded2 = ["label", "id"],
   _excluded3 = ["label", "onClose"];
 var componentName = 'TagSet';
@@ -39,6 +39,7 @@ var TagSet = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
     className = _ref.className,
     maxVisible = _ref.maxVisible,
     multiline = _ref.multiline,
+    overflowAutoAlign = _ref.overflowAutoAlign,
     _ref$overflowAlign = _ref.overflowAlign,
     overflowAlign = _ref$overflowAlign === void 0 ? 'bottom' : _ref$overflowAlign,
     overflowClassName = _ref.overflowClassName,
@@ -145,6 +146,7 @@ var TagSet = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
     });
     newDisplayedTags.push( /*#__PURE__*/React__default.createElement(TagSetOverflow, {
       allTagsModalSearchThreshold: allTagsModalSearchThreshold,
+      overflowAutoAlign: overflowAutoAlign,
       className: overflowClassName,
       onShowAllClick: handleShowAllClick,
       overflowTags: newOverflowTags,
@@ -158,7 +160,7 @@ var TagSet = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
     }));
     onOverflowTagChange === null || onOverflowTagChange === void 0 || onOverflowTagChange(newOverflowTags);
     setDisplayedTags(newDisplayedTags);
-  }, [displayCount, overflowAlign, overflowClassName, overflowType, showAllTagsLabel, tags, onOverflowTagChange, popoverOpen, handleTagOnClose]);
+  }, [displayCount, overflowAlign, overflowClassName, overflowType, showAllTagsLabel, tags, onOverflowTagChange, popoverOpen, handleTagOnClose, overflowAutoAlign]);
   var checkFullyVisibleTags = useCallback(function () {
     if (multiline) {
       return setDisplayCount(maxVisible || 3);
@@ -321,6 +323,10 @@ TagSet.propTypes = {
    * overflowAlign from the standard tooltip. Default center.
    */
   overflowAlign: PropTypes.oneOf(['top', 'top-left', 'top-right', 'bottom', 'bottom-left', 'bottom-right', 'left', 'left-bottom', 'left-top', 'right', 'right-bottom', 'right-top']),
+  /**
+   * Will auto-align the popover on first render if it is not visible. This prop is currently experimental and is subject to future changes.
+   */
+  overflowAutoAlign: PropTypes.bool,
   /**
    * overflowClassName for the tooltip popup
    */

package/es/components/TagSet/TagSetOverflow.d.ts

@@ -26,6 +26,10 @@ interface TagSetOverflowProps {
      * Type of rendering displayed inside of the tag overflow component
      */
     overflowType?: OverflowType;
+    /**
+     * Will auto-align the popover on first render if it is not visible. This prop is currently experimental and is subject to future changes.
+     */
+    overflowAutoAlign?: boolean;
     /**
      * Open state of the popover
      */

package/es/components/TagSet/TagSetOverflow.js

@@ -13,7 +13,7 @@ import { Popover, Tag, PopoverContent, Link } from '@carbon/react';
 import { pkg } from '../../settings.js';
 import { useClickOutside } from '../../global/js/hooks/useClickOutside.js';
 
-var _excluded = ["allTagsModalSearchThreshold", "className", "onShowAllClick", "overflowAlign", "overflowTags", "overflowType", "showAllTagsLabel", "popoverOpen", "setPopoverOpen"];
+var _excluded = ["allTagsModalSearchThreshold", "className", "onShowAllClick", "overflowAlign", "overflowAutoAlign", "overflowTags", "overflowType", "showAllTagsLabel", "popoverOpen", "setPopoverOpen"];
 var componentName = 'TagSetOverflow';
 var blockClass = "".concat(pkg.prefix, "--tag-set-overflow");
 
@@ -28,6 +28,7 @@ var TagSetOverflow = /*#__PURE__*/React__default.forwardRef(function (_ref, ref)
     onShowAllClick = _ref.onShowAllClick,
     _ref$overflowAlign = _ref.overflowAlign,
     overflowAlign = _ref$overflowAlign === void 0 ? 'bottom' : _ref$overflowAlign,
+    overflowAutoAlign = _ref.overflowAutoAlign,
     overflowTags = _ref.overflowTags,
     overflowType = _ref.overflowType,
     showAllTagsLabel = _ref.showAllTagsLabel,
@@ -63,7 +64,8 @@ var TagSetOverflow = /*#__PURE__*/React__default.forwardRef(function (_ref, ref)
     dropShadow: true,
     highContrast: true,
     onKeyDown: handleEscKeyPress,
-    open: popoverOpen
+    open: popoverOpen,
+    autoAlign: overflowAutoAlign
   }, /*#__PURE__*/React__default.createElement(Tag, {
     onClick: function onClick() {
       return setPopoverOpen === null || setPopoverOpen === void 0 ? void 0 : setPopoverOpen(!popoverOpen);
@@ -115,6 +117,10 @@ TagSetOverflow.propTypes = {
    * overflowAlign from the standard tooltip
    */
   overflowAlign: PropTypes.oneOf(['top', 'top-left', 'top-right', 'bottom', 'bottom-left', 'bottom-right', 'left', 'left-bottom', 'left-top', 'right', 'right-bottom', 'right-top']),
+  /**
+   * Will auto-align the popover on first render if it is not visible. This prop is currently experimental and is subject to future changes.
+   */
+  overflowAutoAlign: PropTypes.bool,
   /**
    * tags shown in overflow
    */

package/es/global/js/hooks/useCreateComponentStepChange.d.ts

@@ -1,4 +1,4 @@
-export function useCreateComponentStepChange({ firstIncludedStep, lastIncludedStep, stepData, onPrevious, onNext, isSubmitDisabled, setCurrentStep, setIsSubmitting, setLoadingPrevious, loadingPrevious, onClose, onRequestSubmit, componentName, currentStep, backButtonText, cancelButtonText, submitButtonText, nextButtonText, isSubmitting, componentBlockClass, setCreateComponentActions, setModalIsOpen, }: {
+export function useCreateComponentStepChange({ firstIncludedStep, lastIncludedStep, stepData, onPrevious, onNext, isSubmitDisabled, setCurrentStep, setIsSubmitting, setLoadingPrevious, loadingPrevious, onClose, onRequestSubmit, componentName, currentStep, backButtonText, cancelButtonText, submitButtonText, nextButtonText, isSubmitting, componentBlockClass, setCreateComponentActions, setModalIsOpen, experimentalSecondarySubmit, experimentalSecondarySubmitText, }: {
     firstIncludedStep: any;
     lastIncludedStep: any;
     stepData: any;
@@ -21,4 +21,6 @@ export function useCreateComponentStepChange({ firstIncludedStep, lastIncludedSt
     componentBlockClass: any;
     setCreateComponentActions: any;
     setModalIsOpen: any;
+    experimentalSecondarySubmit: any;
+    experimentalSecondarySubmitText: any;
 }): void;

package/es/global/js/hooks/useCreateComponentStepChange.js

@@ -32,7 +32,9 @@ var useCreateComponentStepChange = function useCreateComponentStepChange(_ref) {
     isSubmitting = _ref.isSubmitting,
     componentBlockClass = _ref.componentBlockClass,
     setCreateComponentActions = _ref.setCreateComponentActions,
-    setModalIsOpen = _ref.setModalIsOpen;
+    setModalIsOpen = _ref.setModalIsOpen,
+    experimentalSecondarySubmit = _ref.experimentalSecondarySubmit,
+    experimentalSecondarySubmitText = _ref.experimentalSecondarySubmitText;
   var continueToNextStep = useCallback(function () {
     setIsSubmitting(false);
     setCurrentStep(function (prev) {
@@ -212,6 +214,11 @@ var useCreateComponentStepChange = function useCreateComponentStepChange(_ref) {
         return _ref5.apply(this, arguments);
       };
     }();
+    var handleExperimentalSecondarySubmit = function handleExperimentalSecondarySubmit() {
+      if (typeof (experimentalSecondarySubmit === null || experimentalSecondarySubmit === void 0 ? void 0 : experimentalSecondarySubmit.onClick) === 'function') {
+        experimentalSecondarySubmit.onClick();
+      }
+    };
     if ((stepData === null || stepData === void 0 ? void 0 : stepData.length) > 0) {
       var buttons = [];
       if ((stepData === null || stepData === void 0 ? void 0 : stepData.length) > 1) {
@@ -232,6 +239,15 @@ var useCreateComponentStepChange = function useCreateComponentStepChange(_ref) {
         } : onUnmount,
         kind: 'ghost'
       });
+      if (experimentalSecondarySubmitText && !(experimentalSecondarySubmit !== null && experimentalSecondarySubmit !== void 0 && experimentalSecondarySubmit.hideSecondarySubmit)) {
+        buttons.push({
+          key: 'create-action-button-experimentalSecondarySubmit',
+          label: experimentalSecondarySubmitText,
+          onClick: handleExperimentalSecondarySubmit,
+          kind: 'secondary',
+          disabled: experimentalSecondarySubmit === null || experimentalSecondarySubmit === void 0 ? void 0 : experimentalSecondarySubmit.disabled
+        });
+      }
       buttons.push({
         key: 'create-action-button-submit',
         label: currentStep < lastIncludedStep ? nextButtonText : submitButtonText,
@@ -243,7 +259,7 @@ var useCreateComponentStepChange = function useCreateComponentStepChange(_ref) {
       });
       setCreateComponentActions(buttons);
     }
-  }, [firstIncludedStep, lastIncludedStep, stepData, onNext, isSubmitDisabled, backButtonText, cancelButtonText, currentStep, onClose, nextButtonText, submitButtonText, onRequestSubmit, isSubmitting, componentBlockClass, componentName, continueToNextStep, setCurrentStep, setCreateComponentActions, setIsSubmitting, setModalIsOpen, moveToPreviousStep, onPrevious, setLoadingPrevious, loadingPrevious]);
+  }, [firstIncludedStep, lastIncludedStep, stepData, onNext, isSubmitDisabled, backButtonText, cancelButtonText, currentStep, onClose, nextButtonText, submitButtonText, onRequestSubmit, isSubmitting, componentBlockClass, componentName, continueToNextStep, setCurrentStep, setCreateComponentActions, setIsSubmitting, setModalIsOpen, moveToPreviousStep, onPrevious, setLoadingPrevious, loadingPrevious, experimentalSecondarySubmit, experimentalSecondarySubmitText]);
 };
 
 export { useCreateComponentStepChange };

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

@@ -5,8 +5,10 @@
  * LICENSE file in the root directory of this source tree.
  */
 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;
@@ -32,6 +34,10 @@ export 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

@@ -31,7 +31,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 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 +49,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 +114,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
@@ -179,6 +184,8 @@ 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, {
@@ -207,6 +214,7 @@ exports.CreateTearsheet = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   }, /*#__PURE__*/React__default["default"].createElement(StepsContext.Provider, {
     value: {
       currentStep: currentStep,
+      setExperimentalSecondarySubmit: setExperimentalSecondarySubmit,
       setIsDisabled: setIsDisabled,
       setOnPrevious: function setOnPrevious(fn) {
         return _setOnPrevious(function () {
@@ -263,6 +271,10 @@ exports.CreateTearsheet.propTypes = {
    * A description of the flow, displayed in the header area of the tearsheet.
    */
   description: index["default"].node,
+  /**
+   * The experimentalSecondary submit button text
+   */
+  experimentalSecondarySubmitText: index["default"].string,
   /**
    * Specifies elements to focus on first on render.
    */

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

@@ -25,7 +25,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 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 +34,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 +91,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 () {
@@ -172,6 +184,21 @@ exports.CreateTearsheetStep.propTypes = {
    * This will conditionally disable the submit button in the multi step Tearsheet
    */
   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.

package/lib/components/TagSet/TagSet.d.ts

@@ -58,6 +58,10 @@ export interface TagSetProps extends PropsWithChildren {
      * overflowAlign from the standard tooltip. Default center.
      */
     overflowAlign?: OverflowAlign;
+    /**
+     * Will auto-align the popover on first render if it is not visible. This prop is currently experimental and is subject to future changes.
+     */
+    overflowAutoAlign?: boolean;
     /**
      * overflowClassName for the tooltip popup
      */

package/lib/components/TagSet/TagSet.js

@@ -26,7 +26,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 
-var _excluded = ["align", "allTagsModalTarget", "className", "maxVisible", "multiline", "overflowAlign", "overflowClassName", "overflowType", "allTagsModalTitle", "allTagsModalSearchLabel", "allTagsModalSearchPlaceholderText", "showAllTagsLabel", "tags", "containingElementRef", "measurementOffset", "onOverflowTagChange"],
+var _excluded = ["align", "allTagsModalTarget", "className", "maxVisible", "multiline", "overflowAutoAlign", "overflowAlign", "overflowClassName", "overflowType", "allTagsModalTitle", "allTagsModalSearchLabel", "allTagsModalSearchPlaceholderText", "showAllTagsLabel", "tags", "containingElementRef", "measurementOffset", "onOverflowTagChange"],
   _excluded2 = ["label", "id"],
   _excluded3 = ["label", "onClose"];
 var componentName = 'TagSet';
@@ -48,6 +48,7 @@ exports.TagSet = /*#__PURE__*/React__default["default"].forwardRef(function (_re
     className = _ref.className,
     maxVisible = _ref.maxVisible,
     multiline = _ref.multiline,
+    overflowAutoAlign = _ref.overflowAutoAlign,
     _ref$overflowAlign = _ref.overflowAlign,
     overflowAlign = _ref$overflowAlign === void 0 ? 'bottom' : _ref$overflowAlign,
     overflowClassName = _ref.overflowClassName,
@@ -154,6 +155,7 @@ exports.TagSet = /*#__PURE__*/React__default["default"].forwardRef(function (_re
     });
     newDisplayedTags.push( /*#__PURE__*/React__default["default"].createElement(TagSetOverflow.TagSetOverflow, {
       allTagsModalSearchThreshold: allTagsModalSearchThreshold,
+      overflowAutoAlign: overflowAutoAlign,
       className: overflowClassName,
       onShowAllClick: handleShowAllClick,
       overflowTags: newOverflowTags,
@@ -167,7 +169,7 @@ exports.TagSet = /*#__PURE__*/React__default["default"].forwardRef(function (_re
     }));
     onOverflowTagChange === null || onOverflowTagChange === void 0 || onOverflowTagChange(newOverflowTags);
     setDisplayedTags(newDisplayedTags);
-  }, [displayCount, overflowAlign, overflowClassName, overflowType, showAllTagsLabel, tags, onOverflowTagChange, popoverOpen, handleTagOnClose]);
+  }, [displayCount, overflowAlign, overflowClassName, overflowType, showAllTagsLabel, tags, onOverflowTagChange, popoverOpen, handleTagOnClose, overflowAutoAlign]);
   var checkFullyVisibleTags = React.useCallback(function () {
     if (multiline) {
       return setDisplayCount(maxVisible || 3);
@@ -330,6 +332,10 @@ exports.TagSet.propTypes = {
    * overflowAlign from the standard tooltip. Default center.
    */
   overflowAlign: index["default"].oneOf(['top', 'top-left', 'top-right', 'bottom', 'bottom-left', 'bottom-right', 'left', 'left-bottom', 'left-top', 'right', 'right-bottom', 'right-top']),
+  /**
+   * Will auto-align the popover on first render if it is not visible. This prop is currently experimental and is subject to future changes.
+   */
+  overflowAutoAlign: index["default"].bool,
   /**
    * overflowClassName for the tooltip popup
    */

package/lib/components/TagSet/TagSetOverflow.d.ts

@@ -26,6 +26,10 @@ interface TagSetOverflowProps {
      * Type of rendering displayed inside of the tag overflow component
      */
     overflowType?: OverflowType;
+    /**
+     * Will auto-align the popover on first render if it is not visible. This prop is currently experimental and is subject to future changes.
+     */
+    overflowAutoAlign?: boolean;
     /**
      * Open state of the popover
      */

package/lib/components/TagSet/TagSetOverflow.js

@@ -22,7 +22,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 
-var _excluded = ["allTagsModalSearchThreshold", "className", "onShowAllClick", "overflowAlign", "overflowTags", "overflowType", "showAllTagsLabel", "popoverOpen", "setPopoverOpen"];
+var _excluded = ["allTagsModalSearchThreshold", "className", "onShowAllClick", "overflowAlign", "overflowAutoAlign", "overflowTags", "overflowType", "showAllTagsLabel", "popoverOpen", "setPopoverOpen"];
 var componentName = 'TagSetOverflow';
 var blockClass = "".concat(settings.pkg.prefix, "--tag-set-overflow");
 
@@ -37,6 +37,7 @@ var TagSetOverflow = /*#__PURE__*/React__default["default"].forwardRef(function
     onShowAllClick = _ref.onShowAllClick,
     _ref$overflowAlign = _ref.overflowAlign,
     overflowAlign = _ref$overflowAlign === void 0 ? 'bottom' : _ref$overflowAlign,
+    overflowAutoAlign = _ref.overflowAutoAlign,
     overflowTags = _ref.overflowTags,
     overflowType = _ref.overflowType,
     showAllTagsLabel = _ref.showAllTagsLabel,
@@ -72,7 +73,8 @@ var TagSetOverflow = /*#__PURE__*/React__default["default"].forwardRef(function
     dropShadow: true,
     highContrast: true,
     onKeyDown: handleEscKeyPress,
-    open: popoverOpen
+    open: popoverOpen,
+    autoAlign: overflowAutoAlign
   }, /*#__PURE__*/React__default["default"].createElement(react.Tag, {
     onClick: function onClick() {
       return setPopoverOpen === null || setPopoverOpen === void 0 ? void 0 : setPopoverOpen(!popoverOpen);
@@ -124,6 +126,10 @@ TagSetOverflow.propTypes = {
    * overflowAlign from the standard tooltip
    */
   overflowAlign: index["default"].oneOf(['top', 'top-left', 'top-right', 'bottom', 'bottom-left', 'bottom-right', 'left', 'left-bottom', 'left-top', 'right', 'right-bottom', 'right-top']),
+  /**
+   * Will auto-align the popover on first render if it is not visible. This prop is currently experimental and is subject to future changes.
+   */
+  overflowAutoAlign: index["default"].bool,
   /**
    * tags shown in overflow
    */

package/lib/global/js/hooks/useCreateComponentStepChange.d.ts

@@ -1,4 +1,4 @@
-export function useCreateComponentStepChange({ firstIncludedStep, lastIncludedStep, stepData, onPrevious, onNext, isSubmitDisabled, setCurrentStep, setIsSubmitting, setLoadingPrevious, loadingPrevious, onClose, onRequestSubmit, componentName, currentStep, backButtonText, cancelButtonText, submitButtonText, nextButtonText, isSubmitting, componentBlockClass, setCreateComponentActions, setModalIsOpen, }: {
+export function useCreateComponentStepChange({ firstIncludedStep, lastIncludedStep, stepData, onPrevious, onNext, isSubmitDisabled, setCurrentStep, setIsSubmitting, setLoadingPrevious, loadingPrevious, onClose, onRequestSubmit, componentName, currentStep, backButtonText, cancelButtonText, submitButtonText, nextButtonText, isSubmitting, componentBlockClass, setCreateComponentActions, setModalIsOpen, experimentalSecondarySubmit, experimentalSecondarySubmitText, }: {
     firstIncludedStep: any;
     lastIncludedStep: any;
     stepData: any;
@@ -21,4 +21,6 @@ export function useCreateComponentStepChange({ firstIncludedStep, lastIncludedSt
     componentBlockClass: any;
     setCreateComponentActions: any;
     setModalIsOpen: any;
+    experimentalSecondarySubmit: any;
+    experimentalSecondarySubmitText: any;
 }): void;

package/lib/global/js/hooks/useCreateComponentStepChange.js

@@ -36,7 +36,9 @@ var useCreateComponentStepChange = function useCreateComponentStepChange(_ref) {
     isSubmitting = _ref.isSubmitting,
     componentBlockClass = _ref.componentBlockClass,
     setCreateComponentActions = _ref.setCreateComponentActions,
-    setModalIsOpen = _ref.setModalIsOpen;
+    setModalIsOpen = _ref.setModalIsOpen,
+    experimentalSecondarySubmit = _ref.experimentalSecondarySubmit,
+    experimentalSecondarySubmitText = _ref.experimentalSecondarySubmitText;
   var continueToNextStep = React.useCallback(function () {
     setIsSubmitting(false);
     setCurrentStep(function (prev) {
@@ -216,6 +218,11 @@ var useCreateComponentStepChange = function useCreateComponentStepChange(_ref) {
         return _ref5.apply(this, arguments);
       };
     }();
+    var handleExperimentalSecondarySubmit = function handleExperimentalSecondarySubmit() {
+      if (typeof (experimentalSecondarySubmit === null || experimentalSecondarySubmit === void 0 ? void 0 : experimentalSecondarySubmit.onClick) === 'function') {
+        experimentalSecondarySubmit.onClick();
+      }
+    };
     if ((stepData === null || stepData === void 0 ? void 0 : stepData.length) > 0) {
       var buttons = [];
       if ((stepData === null || stepData === void 0 ? void 0 : stepData.length) > 1) {
@@ -236,6 +243,15 @@ var useCreateComponentStepChange = function useCreateComponentStepChange(_ref) {
         } : onUnmount,
         kind: 'ghost'
       });
+      if (experimentalSecondarySubmitText && !(experimentalSecondarySubmit !== null && experimentalSecondarySubmit !== void 0 && experimentalSecondarySubmit.hideSecondarySubmit)) {
+        buttons.push({
+          key: 'create-action-button-experimentalSecondarySubmit',
+          label: experimentalSecondarySubmitText,
+          onClick: handleExperimentalSecondarySubmit,
+          kind: 'secondary',
+          disabled: experimentalSecondarySubmit === null || experimentalSecondarySubmit === void 0 ? void 0 : experimentalSecondarySubmit.disabled
+        });
+      }
       buttons.push({
         key: 'create-action-button-submit',
         label: currentStep < lastIncludedStep ? nextButtonText : submitButtonText,
@@ -247,7 +263,7 @@ var useCreateComponentStepChange = function useCreateComponentStepChange(_ref) {
       });
       setCreateComponentActions(buttons);
     }
-  }, [firstIncludedStep, lastIncludedStep, stepData, onNext, isSubmitDisabled, backButtonText, cancelButtonText, currentStep, onClose, nextButtonText, submitButtonText, onRequestSubmit, isSubmitting, componentBlockClass, componentName, continueToNextStep, setCurrentStep, setCreateComponentActions, setIsSubmitting, setModalIsOpen, moveToPreviousStep, onPrevious, setLoadingPrevious, loadingPrevious]);
+  }, [firstIncludedStep, lastIncludedStep, stepData, onNext, isSubmitDisabled, backButtonText, cancelButtonText, currentStep, onClose, nextButtonText, submitButtonText, onRequestSubmit, isSubmitting, componentBlockClass, componentName, continueToNextStep, setCurrentStep, setCreateComponentActions, setIsSubmitting, setModalIsOpen, moveToPreviousStep, onPrevious, setLoadingPrevious, loadingPrevious, experimentalSecondarySubmit, experimentalSecondarySubmitText]);
 };
 
 exports.useCreateComponentStepChange = useCreateComponentStepChange;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@carbon/ibm-products",
   "description": "Carbon for IBM Products",
-  "version": "2.43.2-canary.209+068a7df53",
+  "version": "2.43.2-canary.211+d5f953890",
   "license": "Apache-2.0",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -120,5 +120,5 @@
     "react": "^16.8.6 || ^17.0.1 || ^18.2.0",
     "react-dom": "^16.8.6 || ^17.0.1 || ^18.2.0"
   },
-  "gitHead": "068a7df53265e71193ef583145c69d17b3f76535"
+  "gitHead": "d5f9538902233075e38a60abf70efc52838f5804"
 }