/** * 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. */ import React, { PropsWithChildren } from 'react'; type fieldsetLegendTextProps = { /** * This optional prop will render your form content inside of a fieldset html element * and is defaulted to true. * 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. */ hasFieldset: false; /** * 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. */ fieldsetLegendText?: string; /** * This is the required legend id that appears as the aria-labelledby of fieldset for accessibility purposes. */ fieldsetLegendId?: React.ReactNode; } | { /** * This optional prop will render your form content inside of a fieldset html element * and is defaulted to true. * 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. */ hasFieldset?: true; /** * 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. */ fieldsetLegendText: string; /** * This is the required legend id that appears as the aria-labelledby of fieldset for accessibility purposes. */ fieldsetLegendId: React.ReactNode; }; interface CreateTearsheetStepBaseProps extends PropsWithChildren { /** * Content that shows in the tearsheet step */ children?: React.ReactNode; /** * Sets an optional className to be added to the tearsheet step */ className?: string; /** * Sets an optional description on the step component */ description?: React.ReactNode; /** * 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 */ includeStep?: boolean; /** * 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?: boolean; /** * This optional prop will indicate an error icon on the progress indicator step item */ invalid?: boolean; /** * 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?: () => void; /** * 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?: () => Promise; /** * Optional function to be called when you move to the previous step. */ onPrevious?: () => void; /** * This will conditionally disable the secondary (Back) button in the multi step Tearsheet */ secondaryButtonDisabled?: boolean; /** * Sets the optional secondary label on the progress step component */ secondaryLabel?: string; /** * Sets an optional subtitle on the step component */ subtitle?: string; /** * Sets the title text for a tearsheet step */ 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 const CreateTearsheetStep: React.ForwardRefExoticComponent>; export {}; //# sourceMappingURL=CreateTearsheetStep.d.ts.map