@carbon/ibm-products 2.65.0 → 2.66.0

package/lib/components/CreateModal/CreateModal.js

@@ -16,19 +16,18 @@ var devtools = require('../../global/js/utils/devtools.js');
 var settings = require('../../settings.js');
 var usePortalTarget = require('../../global/js/hooks/usePortalTarget.js');
 
-var _excluded = ["className", "children", "onRequestClose", "onRequestSubmit", "open", "title", "subtitle", "description", "secondaryButtonText", "portalTarget", "primaryButtonText", "disableSubmit", "selectorPrimaryFocus"];
-var componentName = 'CreateModal';
-var blockClass = "".concat(settings.pkg.prefix, "--create-modal");
+const componentName = 'CreateModal';
+const blockClass = `${settings.pkg.prefix}--create-modal`;
 
 // Custom PropType validator which checks and ensures that the children property has no more than 4 nodes
-var isValidChildren = function isValidChildren() {
-  return function (_ref) {
-    var children = _ref.children;
-    if (children && children.length > 4) {
-      throw new Error('The `CreateModal` component does not take more than 4 nodes as children. This is to ensure that the modal does not overflow. Please remove 1 or more nodes.');
-    }
-    return;
-  };
+const isValidChildren = () => _ref => {
+  let {
+    children
+  } = _ref;
+  if (children && children.length > 4) {
+    throw new Error('The `CreateModal` component does not take more than 4 nodes as children. This is to ensure that the modal does not overflow. Please remove 1 or more nodes.');
+  }
+  return;
 };
 /**
  * The `CreateModal` component provides a way for a user to quickly generate a new
@@ -36,45 +35,50 @@ resource. It is triggered by a user’s action, appears on top of the main page
 content, and is persistent until dismissed. The purpose of this modal should be
 immediately apparent to the user, with a clear and obvious path to completion.
  */
-exports.CreateModal = /*#__PURE__*/React.forwardRef(function (_ref2, ref) {
-  var className = _ref2.className,
-    children = _ref2.children,
-    onRequestClose = _ref2.onRequestClose,
-    onRequestSubmit = _ref2.onRequestSubmit,
-    open = _ref2.open,
-    title = _ref2.title,
-    subtitle = _ref2.subtitle,
-    description = _ref2.description,
-    secondaryButtonText = _ref2.secondaryButtonText,
-    portalTargetIn = _ref2.portalTarget,
-    primaryButtonText = _ref2.primaryButtonText,
-    disableSubmit = _ref2.disableSubmit,
-    selectorPrimaryFocus = _ref2.selectorPrimaryFocus,
-    rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref2, _excluded);
-  var renderPortalUse = usePortalTarget.usePortalTarget(portalTargetIn);
+exports.CreateModal = /*#__PURE__*/React.forwardRef((_ref2, ref) => {
+  let {
+    // The component props, in alphabetical order (for consistency).
+
+    className,
+    children,
+    onRequestClose,
+    onRequestSubmit,
+    open,
+    title,
+    subtitle,
+    description,
+    secondaryButtonText,
+    portalTarget: portalTargetIn,
+    primaryButtonText,
+    disableSubmit,
+    selectorPrimaryFocus,
+    // Collect any other property values passed in.
+    ...rest
+  } = _ref2;
+  const renderPortalUse = usePortalTarget.usePortalTarget(portalTargetIn);
   return renderPortalUse(/*#__PURE__*/React.createElement(react.ComposedModal, _rollupPluginBabelHelpers.extends({}, rest, {
     selectorPrimaryFocus: selectorPrimaryFocus,
     className: cx(blockClass, className),
-    open: open,
-    ref: ref,
+    open,
+    ref,
     "aria-label": title,
     size: "sm",
     preventCloseOnClickOutside: true,
-    onClose: function onClose() {
-      onRequestClose === null || onRequestClose === void 0 || onRequestClose();
+    onClose: () => {
+      onRequestClose?.();
       return false;
     }
   }, devtools.getDevtoolsProps(componentName)), /*#__PURE__*/React.createElement(react.ModalHeader, {
     title: title,
-    titleClassName: "".concat(blockClass, "__title")
+    titleClassName: `${blockClass}__title`
   }, subtitle && /*#__PURE__*/React.createElement("p", {
-    className: "".concat(blockClass, "__subtitle")
+    className: `${blockClass}__subtitle`
   }, subtitle)), /*#__PURE__*/React.createElement(react.ModalBody, {
     hasForm: true
   }, description && /*#__PURE__*/React.createElement("p", {
-    className: "".concat(blockClass, "__description")
+    className: `${blockClass}__description`
   }, description), /*#__PURE__*/React.createElement(react.Form, {
-    className: "".concat(blockClass, "__form"),
+    className: `${blockClass}__form`,
     "aria-label": title
   }, children)), /*#__PURE__*/React.createElement(react.ModalFooter, null, /*#__PURE__*/React.createElement(react.Button, {
     type: "button",

package/lib/components/CreateSidePanel/CreateSidePanel.js

@@ -17,39 +17,40 @@ var react = require('@carbon/react');
 var SidePanel = require('../SidePanel/SidePanel.js');
 var uuidv4 = require('../../global/js/utils/uuidv4.js');
 
-var _excluded = ["className", "children", "disableSubmit", "formTitle", "formDescription", "id", "onRequestClose", "onRequestSubmit", "open", "primaryButtonText", "secondaryButtonText", "selectorPageContent", "selectorPrimaryFocus", "subtitle", "title"];
-
 // The block part of our conventional BEM class names (blockClass__E--M).
-var blockClass = "".concat(settings.pkg.prefix, "--create-side-panel");
-var componentName = 'CreateSidePanel';
+const blockClass = `${settings.pkg.prefix}--create-side-panel`;
+const componentName = 'CreateSidePanel';
 
 // NOTE: the component SCSS is not imported here: it is rolled up separately.
 
 /**
  * Use with medium complexity creations if the user needs page context. On-page content can be seen and interacted with.
  */
-exports.CreateSidePanel = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
-  var className = _ref.className,
-    children = _ref.children,
-    disableSubmit = _ref.disableSubmit,
-    formTitle = _ref.formTitle,
-    formDescription = _ref.formDescription,
-    id = _ref.id,
-    onRequestClose = _ref.onRequestClose,
-    onRequestSubmit = _ref.onRequestSubmit,
-    open = _ref.open,
-    primaryButtonText = _ref.primaryButtonText,
-    secondaryButtonText = _ref.secondaryButtonText,
-    selectorPageContent = _ref.selectorPageContent,
-    selectorPrimaryFocus = _ref.selectorPrimaryFocus,
-    subtitle = _ref.subtitle,
-    title = _ref.title,
-    rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
-  var actions = [{
+exports.CreateSidePanel = /*#__PURE__*/React.forwardRef((_ref, ref) => {
+  let {
+    // The component props, in alphabetical order (for consistency).
+    className,
+    children,
+    disableSubmit,
+    formTitle,
+    formDescription,
+    id,
+    onRequestClose,
+    onRequestSubmit,
+    open,
+    primaryButtonText,
+    secondaryButtonText,
+    selectorPageContent,
+    selectorPrimaryFocus,
+    subtitle,
+    title,
+    ...rest
+  } = _ref;
+  const actions = [{
     label: primaryButtonText,
-    onClick: function onClick(event) {
+    onClick: event => {
       event.preventDefault();
-      onRequestSubmit === null || onRequestSubmit === void 0 || onRequestSubmit();
+      onRequestSubmit?.();
     },
     kind: 'primary',
     disabled: disableSubmit,
@@ -59,17 +60,17 @@ exports.CreateSidePanel = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     onClick: onRequestClose,
     kind: 'secondary'
   }];
-  var formTitleId = uuidv4.default();
-  return selectorPageContent && /*#__PURE__*/React.createElement(SidePanel.SidePanel, _rollupPluginBabelHelpers.extends({}, rest, _rollupPluginBabelHelpers.objectSpread2({
-    id: id,
-    open: open,
-    ref: ref,
-    selectorPageContent: selectorPageContent,
-    onRequestClose: onRequestClose,
-    title: title,
-    subtitle: subtitle,
-    selectorPrimaryFocus: selectorPrimaryFocus
-  }, devtools.getDevtoolsProps(componentName)), {
+  const formTitleId = uuidv4.default();
+  return selectorPageContent && /*#__PURE__*/React.createElement(SidePanel.SidePanel, _rollupPluginBabelHelpers.extends({}, rest, {
+    id,
+    open,
+    ref,
+    selectorPageContent,
+    onRequestClose,
+    title,
+    subtitle,
+    selectorPrimaryFocus
+  }, devtools.getDevtoolsProps(componentName), {
     placement: "right",
     slideIn: true,
     animateTitle: false,
@@ -77,12 +78,12 @@ exports.CreateSidePanel = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     size: "md",
     actions: actions
   }), /*#__PURE__*/React.createElement("h3", {
-    className: "".concat(blockClass, "__form-title-text ").concat(blockClass, "__content-text"),
+    className: `${blockClass}__form-title-text ${blockClass}__content-text`,
     id: formTitleId
   }, formTitle), /*#__PURE__*/React.createElement("p", {
-    className: "".concat(blockClass, "__form-description-text ").concat(blockClass, "__content-text")
+    className: `${blockClass}__form-description-text ${blockClass}__content-text`
   }, formDescription), /*#__PURE__*/React.createElement(react.Form, {
-    className: "".concat(blockClass, "__form"),
+    className: `${blockClass}__form`,
     "aria-labelledby": formTitleId
   }, children));
 });

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

@@ -1,5 +1,5 @@
 /**
- * Copyright IBM Corp. 2021, 2022
+ * Copyright IBM Corp. 2021, 2025
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.

package/lib/components/CreateTearsheet/CreateTearsheet.js

@@ -25,106 +25,67 @@ var useResetCreateComponent = require('../../global/js/hooks/useResetCreateCompo
 var useCreateComponentStepChange = require('../../global/js/hooks/useCreateComponentStepChange.js');
 var CreateInfluencer = require('../CreateInfluencer/CreateInfluencer.js');
 
-var _excluded = ["backButtonText", "cancelButtonText", "children", "className", "experimentalSecondarySubmitText", "firstFocusElement", "description", "hasError", "influencerWidth", "initialStep", "label", "nextButtonText", "onClose", "onRequestSubmit", "open", "selectorPrimaryFocus", "slug", "decorator", "submitButtonText", "title", "verticalPosition"];
-var componentName = 'CreateTearsheet';
-var blockClass = "".concat(settings.pkg.prefix, "--tearsheet-create");
+const componentName = 'CreateTearsheet';
+const blockClass = `${settings.pkg.prefix}--tearsheet-create`;
 
 // This is a general context for the steps container
 // containing information about the state of the container
 // and providing some callback methods for steps to use
 
-var StepsContext = /*#__PURE__*/React.createContext(null);
+const StepsContext = /*#__PURE__*/React.createContext(null);
 
 // This is a context supplied separately to each step in the container
 // to let it know what number it is in the sequence of steps
-var StepNumberContext = /*#__PURE__*/React.createContext(-1);
-exports.CreateTearsheet = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
-  var backButtonText = _ref.backButtonText,
-    cancelButtonText = _ref.cancelButtonText,
-    children = _ref.children,
-    className = _ref.className,
-    experimentalSecondarySubmitText = _ref.experimentalSecondarySubmitText,
-    firstFocusElement = _ref.firstFocusElement,
-    description = _ref.description,
-    hasError = _ref.hasError,
-    _ref$influencerWidth = _ref.influencerWidth,
-    influencerWidth = _ref$influencerWidth === void 0 ? 'narrow' : _ref$influencerWidth,
-    initialStep = _ref.initialStep,
-    label = _ref.label,
-    nextButtonText = _ref.nextButtonText,
-    onClose = _ref.onClose,
-    onRequestSubmit = _ref.onRequestSubmit,
-    open = _ref.open,
-    selectorPrimaryFocus = _ref.selectorPrimaryFocus,
-    deprecated_slug = _ref.slug,
-    decorator = _ref.decorator,
-    submitButtonText = _ref.submitButtonText,
-    title = _ref.title,
-    _ref$verticalPosition = _ref.verticalPosition,
-    verticalPosition = _ref$verticalPosition === void 0 ? 'normal' : _ref$verticalPosition,
-    rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
-  var _useState = React.useState([]),
-    _useState2 = _rollupPluginBabelHelpers.slicedToArray(_useState, 2),
-    createTearsheetActions = _useState2[0],
-    setCreateTearsheetActions = _useState2[1];
-  var _useState3 = React.useState(false),
-    _useState4 = _rollupPluginBabelHelpers.slicedToArray(_useState3, 2);
-    _useState4[0];
-    _useState4[1];
-  var _useState5 = React.useState(0),
-    _useState6 = _rollupPluginBabelHelpers.slicedToArray(_useState5, 2),
-    currentStep = _useState6[0],
-    setCurrentStep = _useState6[1];
-  var _useState7 = React.useState(false),
-    _useState8 = _rollupPluginBabelHelpers.slicedToArray(_useState7, 2),
-    isSubmitting = _useState8[0],
-    setIsSubmitting = _useState8[1];
-  var _useState9 = React.useState(false),
-    _useState10 = _rollupPluginBabelHelpers.slicedToArray(_useState9, 2),
-    isDisabled = _useState10[0],
-    setIsDisabled = _useState10[1];
-  var _useState11 = React.useState(false),
-    _useState12 = _rollupPluginBabelHelpers.slicedToArray(_useState11, 2),
-    loadingPrevious = _useState12[0],
-    setLoadingPrevious = _useState12[1];
-  var _useState13 = React.useState(),
-    _useState14 = _rollupPluginBabelHelpers.slicedToArray(_useState13, 2),
-    onPrevious = _useState14[0],
-    _setOnPrevious = _useState14[1];
-  var _useState15 = React.useState(),
-    _useState16 = _rollupPluginBabelHelpers.slicedToArray(_useState15, 2),
-    onNext = _useState16[0],
-    _setOnNext = _useState16[1];
-  var _useState17 = React.useState(),
-    _useState18 = _rollupPluginBabelHelpers.slicedToArray(_useState17, 2),
-    onMount = _useState18[0],
-    _setOnMount = _useState18[1];
-  var _useState19 = React.useState([]),
-    _useState20 = _rollupPluginBabelHelpers.slicedToArray(_useState19, 2),
-    stepData = _useState20[0],
-    setStepData = _useState20[1];
-  var _useState21 = React.useState(1),
-    _useState22 = _rollupPluginBabelHelpers.slicedToArray(_useState21, 2),
-    firstIncludedStep = _useState22[0],
-    setFirstIncludedStep = _useState22[1];
-  var _useState23 = React.useState(),
-    _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
+const StepNumberContext = /*#__PURE__*/React.createContext(-1);
+exports.CreateTearsheet = /*#__PURE__*/React.forwardRef((_ref, ref) => {
+  let {
+    // The component props, in alphabetical order (for consistency).
+
+    backButtonText,
+    cancelButtonText,
+    children,
+    className,
+    experimentalSecondarySubmitText,
+    firstFocusElement,
+    description,
+    hasError,
+    influencerWidth = 'narrow',
+    initialStep,
+    label,
+    nextButtonText,
+    onClose,
+    onRequestSubmit,
+    open,
+    selectorPrimaryFocus,
+    slug: deprecated_slug,
+    decorator,
+    submitButtonText,
+    title,
+    verticalPosition = 'normal',
+    // Collect any other property values passed in.
+    ...rest
+  } = _ref;
+  const [createTearsheetActions, setCreateTearsheetActions] = React.useState([]);
+  const [shouldViewAll, setShouldViewAll] = React.useState(false);
+  const [currentStep, setCurrentStep] = React.useState(0);
+  const [isSubmitting, setIsSubmitting] = React.useState(false);
+  const [isDisabled, setIsDisabled] = React.useState(false);
+  const [loadingPrevious, setLoadingPrevious] = React.useState(false);
+  const [onPrevious, setOnPrevious] = React.useState();
+  const [onNext, setOnNext] = React.useState();
+  const [onMount, setOnMount] = React.useState();
+  const [stepData, setStepData] = React.useState([]);
+  const [firstIncludedStep, setFirstIncludedStep] = React.useState(1);
+  const [lastIncludedStep, setLastIncludedStep] = React.useState();
+  const [experimentalSecondarySubmit, setExperimentalSecondarySubmit] = React.useState();
+  const previousState = usePreviousValue.usePreviousValue({
+    currentStep,
+    open
   });
-  var contentRef = React.useRef(null);
-  React.useEffect(function () {
-    var firstItem = stepData.findIndex(function (item) {
-      return item.shouldIncludeStep === true;
-    }) + 1;
-    var lastItem = lastIndexInArray.lastIndexInArray(stepData, 'shouldIncludeStep', true);
+  const contentRef = React.useRef(null);
+  React.useEffect(() => {
+    const firstItem = stepData.findIndex(item => item.shouldIncludeStep === true) + 1;
+    const lastItem = lastIndexInArray.lastIndexInArray(stepData, 'shouldIncludeStep', true);
     if (firstItem !== firstIncludedStep) {
       setCurrentStep(firstItem);
       setFirstIncludedStep(firstItem);
@@ -133,110 +94,97 @@ exports.CreateTearsheet = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
       setLastIncludedStep(lastItem);
     }
     if (open && initialStep) {
-      var numberOfHiddenSteps = getNumberOfHiddenSteps.getNumberOfHiddenSteps(stepData, initialStep);
+      const numberOfHiddenSteps = getNumberOfHiddenSteps.getNumberOfHiddenSteps(stepData, initialStep);
       setCurrentStep(Number(initialStep + numberOfHiddenSteps));
     }
   }, [firstIncludedStep, initialStep, lastIncludedStep, open, stepData]);
   useCreateComponentFocus.useCreateComponentFocus({
-    previousState: previousState,
-    currentStep: currentStep,
-    blockClass: blockClass,
-    onMount: onMount,
-    firstFocusElement: firstFocusElement
+    previousState,
+    currentStep,
+    blockClass,
+    onMount,
+    firstFocusElement
   });
   useValidCreateStepCount.useValidCreateStepCount(stepData.length, componentName);
   useResetCreateComponent.useResetCreateComponent({
-    firstIncludedStep: firstIncludedStep,
-    previousState: previousState,
+    firstIncludedStep,
+    previousState,
     /**@ts-ignore */
-    open: open,
-    setCurrentStep: setCurrentStep,
-    stepData: stepData,
+    open,
+    setCurrentStep,
+    stepData,
     /**@ts-ignore */
-    initialStep: initialStep,
-    totalSteps: stepData === null || stepData === void 0 ? void 0 : stepData.length,
-    componentName: componentName
+    initialStep,
+    totalSteps: stepData?.length,
+    componentName
   });
   useCreateComponentStepChange.useCreateComponentStepChange({
-    firstIncludedStep: firstIncludedStep,
-    lastIncludedStep: lastIncludedStep,
-    stepData: stepData,
-    onPrevious: onPrevious,
-    onNext: onNext,
+    firstIncludedStep,
+    lastIncludedStep,
+    stepData,
+    onPrevious,
+    onNext,
     isSubmitDisabled: isDisabled,
-    setCurrentStep: setCurrentStep,
-    setIsSubmitting: setIsSubmitting,
+    setCurrentStep,
+    setIsSubmitting,
     /**@ts-ignore */
-    setLoadingPrevious: setLoadingPrevious,
-    loadingPrevious: loadingPrevious,
-    onClose: onClose,
-    onRequestSubmit: onRequestSubmit,
-    componentName: componentName,
-    currentStep: currentStep,
-    backButtonText: backButtonText,
-    cancelButtonText: cancelButtonText,
-    submitButtonText: submitButtonText,
-    nextButtonText: nextButtonText,
-    isSubmitting: isSubmitting,
+    setLoadingPrevious,
+    loadingPrevious,
+    onClose,
+    onRequestSubmit,
+    componentName,
+    currentStep,
+    backButtonText,
+    cancelButtonText,
+    submitButtonText,
+    nextButtonText,
+    isSubmitting,
     componentBlockClass: blockClass,
-    experimentalSecondarySubmit: experimentalSecondarySubmit,
-    experimentalSecondarySubmitText: experimentalSecondarySubmit !== null && experimentalSecondarySubmit !== void 0 && experimentalSecondarySubmit.labelText ? experimentalSecondarySubmit.labelText : experimentalSecondarySubmitText,
+    experimentalSecondarySubmit,
+    experimentalSecondarySubmitText: experimentalSecondarySubmit?.labelText ? experimentalSecondarySubmit.labelText : experimentalSecondarySubmitText,
     setCreateComponentActions: setCreateTearsheetActions
   });
   return /*#__PURE__*/React.createElement(TearsheetShell.TearsheetShell, _rollupPluginBabelHelpers.extends({}, devtools.getDevtoolsProps(componentName), rest, {
-    ref: ref,
+    ref,
     actions: createTearsheetActions,
     className: cx(blockClass, className),
-    description: description,
+    description,
     influencer: /*#__PURE__*/React.createElement(CreateInfluencer.CreateInfluencer, {
       currentStep: currentStep,
       stepData: stepData
     }),
-    influencerWidth: influencerWidth,
-    label: label,
-    onClose: onClose,
-    open: open,
+    influencerWidth,
+    label,
+    onClose,
+    open,
     size: 'wide',
     decorator: decorator || deprecated_slug,
-    title: title,
-    verticalPosition: verticalPosition,
+    title,
+    verticalPosition,
     closeIconDescription: '',
     currentStep: currentStep,
     hasError: hasError,
     selectorPrimaryFocus: selectorPrimaryFocus
   }), /*#__PURE__*/React.createElement("div", {
-    className: "".concat(blockClass, "__content"),
+    className: `${blockClass}__content`,
     ref: contentRef
   }, /*#__PURE__*/React.createElement(react.Form, {
     "aria-label": title
   }, /*#__PURE__*/React.createElement(StepsContext.Provider, {
     value: {
-      currentStep: currentStep,
-      setExperimentalSecondarySubmit: setExperimentalSecondarySubmit,
-      setIsDisabled: setIsDisabled,
-      setOnPrevious: function setOnPrevious(fn) {
-        return _setOnPrevious(function () {
-          return fn;
-        });
-      },
-      setOnNext: function setOnNext(fn) {
-        return _setOnNext(function () {
-          return fn;
-        });
-      },
-      setOnMount: function setOnMount(fn) {
-        return _setOnMount(function () {
-          return fn;
-        });
-      },
-      setStepData: setStepData,
-      stepData: stepData
+      currentStep,
+      setExperimentalSecondarySubmit,
+      setIsDisabled,
+      setOnPrevious: fn => setOnPrevious(() => fn),
+      setOnNext: fn => setOnNext(() => fn),
+      setOnMount: fn => setOnMount(() => fn),
+      setStepData,
+      stepData
     }
-  }, React.Children.map(children, function (child, index) {
-    return /*#__PURE__*/React.createElement(StepNumberContext.Provider, {
-      value: index + 1
-    }, child);
-  })))));
+  }, React.Children.toArray(children).filter(Boolean).map((child, index) => /*#__PURE__*/React.createElement(StepNumberContext.Provider, {
+    value: index + 1,
+    key: index
+  }, child))))));
 });
 
 // Return a placeholder if not released and not enabled by feature flag
@@ -245,7 +193,7 @@ exports.CreateTearsheet = settings.pkg.checkComponentEnabled(exports.CreateTears
 // The display name of the component, used by React. Note that displayName
 // is used in preference to relying on function.name.
 exports.CreateTearsheet.displayName = componentName;
-var deprecatedProps = {
+const deprecatedProps = {
   /**
    *  @deprecated Property replaced by `decorator`
    */
@@ -253,7 +201,7 @@ var deprecatedProps = {
 };
 // Note that the descriptions here should be kept in sync with those for the
 // corresponding props for TearsheetNarrow and TearsheetShell components.
-exports.CreateTearsheet.propTypes = _rollupPluginBabelHelpers.objectSpread2({
+exports.CreateTearsheet.propTypes = {
   /**
    * The back button text
    */
@@ -346,8 +294,9 @@ exports.CreateTearsheet.propTypes = _rollupPluginBabelHelpers.objectSpread2({
    * 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'])
-}, deprecatedProps);
+  verticalPosition: index.default.oneOf(['normal', 'lower']),
+  ...deprecatedProps
+};
 
 exports.StepNumberContext = StepNumberContext;
 exports.StepsContext = StepsContext;

package/lib/components/CreateTearsheet/CreateTearsheetDivider.js

@@ -13,12 +13,14 @@ var index = require('../../_virtual/index.js');
 var cx = require('classnames');
 var settings = require('../../settings.js');
 
-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);
+const componentName = 'CreateTearsheetDivider';
+const blockClass = `${settings.pkg.prefix}--tearsheet-create__section--divider`;
+exports.CreateTearsheetDivider = /*#__PURE__*/React.forwardRef((_ref, ref) => {
+  let {
+    className,
+    // Collect any other property values passed in
+    ...rest
+  } = _ref;
   return /*#__PURE__*/React.createElement("span", _rollupPluginBabelHelpers.extends({}, rest, {
     ref: ref,
     className: cx(blockClass, className)