npm - @pega/cosmos-react-core - Versions diffs - 9.0.0-build.9.9 → 9.0.0 - Mend

@pega/cosmos-react-core 9.0.0-build.9.9 → 9.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1414) hide show

package/lib/components/MultiStepForm/MultiStepForm.d.ts CHANGED Viewed

@@ -1,11 +1,196 @@
 import type { ForwardRefForwardPropsComponent } from '../../types';
-import type MultiStepFormProps from './MultiStepForm.types';
-export declare const StyledForm: import("styled-components").StyledComponent<"form", import("styled-components").DefaultTheme, {
+import type { MultiStepFormProps } from './MultiStepForm.types';
+export declare const StyledForm: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").FormHTMLAttributes<HTMLFormElement>, HTMLFormElement>, {
     actions?: boolean;
     heading?: boolean;
-}, never>;
-export declare const StyledFormContent: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
-export declare const StyledRequiredFieldLegend: import("styled-components").StyledComponent<ForwardRefForwardPropsComponent<import("../Text").TextProps>, import("styled-components").DefaultTheme, {}, never>;
+}>> & string;
+export declare const StyledFormContent: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const StyledInstructionText: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<(Omit<Omit<Pick<import("../Grid/Grid.types").BaseGridProps & import("../../types").BaseProps & import("../../types").AsProp & {
+    children?: import("react").ReactNode;
+    ref?: import("react").Ref<Element>;
+    xs?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    sm?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    md?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    lg?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    xl?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+}, "ref" | "className" | "children" | keyof import("../../types").AsProp> & Required<Pick<import("../Grid/Grid.types").BaseGridProps & import("../../types").BaseProps & import("../../types").AsProp & {
+    children?: import("react").ReactNode;
+    ref?: import("react").Ref<Element>;
+    xs?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    sm?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    md?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    lg?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    xl?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+}, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps & import("../../types").BaseProps & import("../../types").AsProp & {
+    children?: import("react").ReactNode;
+    ref?: import("react").Ref<Element>;
+    xs?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    sm?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    md?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    lg?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    xl?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+}, "item" | "xs" | "xl" | "sm" | "md" | "lg">>, "ref"> & import("react").RefAttributes<Element> & import("../../types").ForwardProps, "ref"> & {
+    ref?: import("react").RefObject<Element> | ((instance: Element | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | null | undefined;
+}) | (Omit<Omit<Pick<import("../Grid/Grid.types").BaseGridProps & import("../../types").BaseProps & import("../../types").AsProp & {
+    children?: import("react").ReactNode;
+    ref?: import("react").Ref<Element>;
+    xs?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    sm?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    md?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    lg?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    xl?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+}, "ref" | "className" | "children" | keyof import("../../types").AsProp> & Required<Pick<import("../Grid/Grid.types").BaseGridProps & import("../../types").BaseProps & import("../../types").AsProp & {
+    children?: import("react").ReactNode;
+    ref?: import("react").Ref<Element>;
+    xs?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    sm?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    md?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    lg?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    xl?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+}, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps & import("../../types").BaseProps & import("../../types").AsProp & {
+    children?: import("react").ReactNode;
+    ref?: import("react").Ref<Element>;
+    xs?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    sm?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    md?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    lg?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    xl?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+}, "container" | "xs" | "xl" | "sm" | "md" | "lg">>, "ref"> & import("react").RefAttributes<Element> & import("../../types").ForwardProps, "ref"> & {
+    ref?: import("react").RefObject<Element> | ((instance: Element | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | null | undefined;
+}) | (Omit<Omit<Pick<import("../Grid/Grid.types").BaseGridProps & import("../../types").BaseProps & import("../../types").AsProp & {
+    children?: import("react").ReactNode;
+    ref?: import("react").Ref<Element>;
+    xs?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    sm?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    md?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    lg?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    xl?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+}, "ref" | "className" | "children" | keyof import("../../types").AsProp> & Required<Pick<import("../Grid/Grid.types").BaseGridProps & import("../../types").BaseProps & import("../../types").AsProp & {
+    children?: import("react").ReactNode;
+    ref?: import("react").Ref<Element>;
+    xs?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    sm?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    md?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    lg?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    xl?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+}, "xs">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps & import("../../types").BaseProps & import("../../types").AsProp & {
+    children?: import("react").ReactNode;
+    ref?: import("react").Ref<Element>;
+    xs?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    sm?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    md?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    lg?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    xl?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+}, "container" | "item" | "xl" | "sm" | "md" | "lg">>, "ref"> & import("react").RefAttributes<Element> & import("../../types").ForwardProps, "ref"> & {
+    ref?: import("react").RefObject<Element> | ((instance: Element | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | null | undefined;
+}) | (Omit<Omit<Pick<import("../Grid/Grid.types").BaseGridProps & import("../../types").BaseProps & import("../../types").AsProp & {
+    children?: import("react").ReactNode;
+    ref?: import("react").Ref<Element>;
+    xs?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    sm?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    md?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    lg?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    xl?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+}, "ref" | "className" | "children" | keyof import("../../types").AsProp> & Required<Pick<import("../Grid/Grid.types").BaseGridProps & import("../../types").BaseProps & import("../../types").AsProp & {
+    children?: import("react").ReactNode;
+    ref?: import("react").Ref<Element>;
+    xs?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    sm?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    md?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    lg?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    xl?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+}, "xl">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps & import("../../types").BaseProps & import("../../types").AsProp & {
+    children?: import("react").ReactNode;
+    ref?: import("react").Ref<Element>;
+    xs?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    sm?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    md?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    lg?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    xl?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+}, "container" | "item" | "xs" | "sm" | "md" | "lg">>, "ref"> & import("react").RefAttributes<Element> & import("../../types").ForwardProps, "ref"> & {
+    ref?: import("react").RefObject<Element> | ((instance: Element | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | null | undefined;
+}) | (Omit<Omit<Pick<import("../Grid/Grid.types").BaseGridProps & import("../../types").BaseProps & import("../../types").AsProp & {
+    children?: import("react").ReactNode;
+    ref?: import("react").Ref<Element>;
+    xs?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    sm?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    md?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    lg?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    xl?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+}, "ref" | "className" | "children" | keyof import("../../types").AsProp> & Required<Pick<import("../Grid/Grid.types").BaseGridProps & import("../../types").BaseProps & import("../../types").AsProp & {
+    children?: import("react").ReactNode;
+    ref?: import("react").Ref<Element>;
+    xs?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    sm?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    md?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    lg?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    xl?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+}, "sm">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps & import("../../types").BaseProps & import("../../types").AsProp & {
+    children?: import("react").ReactNode;
+    ref?: import("react").Ref<Element>;
+    xs?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    sm?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    md?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    lg?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    xl?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+}, "container" | "item" | "xs" | "xl" | "md" | "lg">>, "ref"> & import("react").RefAttributes<Element> & import("../../types").ForwardProps, "ref"> & {
+    ref?: import("react").RefObject<Element> | ((instance: Element | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | null | undefined;
+}) | (Omit<Omit<Pick<import("../Grid/Grid.types").BaseGridProps & import("../../types").BaseProps & import("../../types").AsProp & {
+    children?: import("react").ReactNode;
+    ref?: import("react").Ref<Element>;
+    xs?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    sm?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    md?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    lg?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    xl?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+}, "ref" | "className" | "children" | keyof import("../../types").AsProp> & Required<Pick<import("../Grid/Grid.types").BaseGridProps & import("../../types").BaseProps & import("../../types").AsProp & {
+    children?: import("react").ReactNode;
+    ref?: import("react").Ref<Element>;
+    xs?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    sm?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    md?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    lg?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    xl?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+}, "md">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps & import("../../types").BaseProps & import("../../types").AsProp & {
+    children?: import("react").ReactNode;
+    ref?: import("react").Ref<Element>;
+    xs?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    sm?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    md?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    lg?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    xl?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+}, "container" | "item" | "xs" | "xl" | "sm" | "lg">>, "ref"> & import("react").RefAttributes<Element> & import("../../types").ForwardProps, "ref"> & {
+    ref?: import("react").RefObject<Element> | ((instance: Element | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | null | undefined;
+}) | (Omit<Omit<Pick<import("../Grid/Grid.types").BaseGridProps & import("../../types").BaseProps & import("../../types").AsProp & {
+    children?: import("react").ReactNode;
+    ref?: import("react").Ref<Element>;
+    xs?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    sm?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    md?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    lg?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    xl?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+}, "ref" | "className" | "children" | keyof import("../../types").AsProp> & Required<Pick<import("../Grid/Grid.types").BaseGridProps & import("../../types").BaseProps & import("../../types").AsProp & {
+    children?: import("react").ReactNode;
+    ref?: import("react").Ref<Element>;
+    xs?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    sm?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    md?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    lg?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    xl?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+}, "lg">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps & import("../../types").BaseProps & import("../../types").AsProp & {
+    children?: import("react").ReactNode;
+    ref?: import("react").Ref<Element>;
+    xs?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    sm?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    md?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    lg?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+    xl?: Pick<import("../Grid/Grid.types").BaseGridProps, never> & ((Required<Pick<import("../Grid/Grid.types").BaseGridProps, "container">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "item">>) | (Required<Pick<import("../Grid/Grid.types").BaseGridProps, "item">> & Partial<Pick<import("../Grid/Grid.types").BaseGridProps, "container">>));
+}, "container" | "item" | "xs" | "xl" | "sm" | "md">>, "ref"> & import("react").RefAttributes<Element> & import("../../types").ForwardProps, "ref"> & {
+    ref?: import("react").RefObject<Element> | ((instance: Element | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | null | undefined;
+}), import("styled-components/dist/types").BaseObject>> & string & Omit<ForwardRefForwardPropsComponent<import("../Grid").GridProps>, keyof import("react").Component<any, {}, any>>;
+export declare const StyledRequiredFieldLegend: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<Omit<import("../Text").TextProps, "ref"> & import("react").RefAttributes<HTMLHeadingElement | HTMLSpanElement> & import("../../types").ForwardProps, "ref"> & {
+    ref?: ((instance: HTMLHeadingElement | HTMLSpanElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLHeadingElement | HTMLSpanElement> | null | undefined;
+}, never>> & string & Omit<ForwardRefForwardPropsComponent<import("../Text").TextProps>, keyof import("react").Component<any, {}, any>>;
 declare const MultiStepForm: ForwardRefForwardPropsComponent<MultiStepFormProps>;
 export default MultiStepForm;
 //# sourceMappingURL=MultiStepForm.d.ts.map

package/lib/components/MultiStepForm/MultiStepForm.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MultiStepForm.d.ts","sourceRoot":"","sources":["../../../src/components/MultiStepForm/MultiStepForm.tsx"],"names":[],"mappings":"~~AAaA~~,OAAO,KAAK,EAAE,+BAA+B,EAAE,MAAM,aAAa,CAAC;AAWnE,OAAO,KAAK,kBAAkB,MAAM,uBAAuB,CAAC;~~AAI5D~~,eAAO,MAAM,UAAU;cAA2B,OAAO;cAAY,OAAO;~~SAuB3E~~,CAAC;AAIF,eAAO,MAAM,iBAAiB,~~yGAAe~~,CAAC;AAE9C,eAAO,MAAM,yBAAyB,~~gKAqBpC,~~CAAC;AAIH,QAAA,MAAM,aAAa,EAAE,+BAA+B,CAAC,kBAAkB,~~CA2LtE~~,CAAC;AAEF,eAAe,aAAa,CAAC"}
1	+ {"version":3,"file":"MultiStepForm.d.ts","sourceRoot":"","sources":["../../../src/components/MultiStepForm/MultiStepForm.tsx"],"names":[],"mappings":"AAcA,OAAO,KAAK,EAAE,+BAA+B,EAAE,MAAM,aAAa,CAAC;AAWnE,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AAIhE,eAAO,MAAM,UAAU;cAA2B,OAAO;cAAY,OAAO;YAuB3E,CAAC;AAIF,eAAO,MAAM,iBAAiB,6NAAe,CAAC;AAE9C,eAAO,MAAM,qBAAqB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;oLAIjC,CAAC;AAEF,eAAO,MAAM,yBAAyB;;uIAqBpC,CAAC;AAIH,QAAA,MAAM,aAAa,EAAE,+BAA+B,CAAC,kBAAkB,CAsNtE,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/lib/components/MultiStepForm/MultiStepForm.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { forwardRef, useRef, useEffect } from 'react';
 import styled, { css } from 'styled-components';
-import { useAfterInitialEffect, useUID, useI18n, usePrevious, useBreakpoint, useTheme, useConsolidatedRef } from '../../hooks';
+import { useAfterInitialEffect, useUID, useI18n, usePrevious, useBreakpoint, useTheme, useConsolidatedRef, useConfiguration } from '../../hooks';
 import { focusNonInteractiveElement, isInstance } from '../../utils';
 import { calculateFontSize } from '../../styles';
 import Text from '../Text';
@@ -37,6 +37,11 @@ export const StyledForm = styled.form(({ actions, heading, theme }) => {
 });
 StyledForm.defaultProps = defaultThemeProp;
 export const StyledFormContent = styled.div ``;
+export const StyledInstructionText = styled(Grid) `
+  /* Prevent instruction text from contributing to modal width calculation */
+  width: 0;
+  min-width: 100%;
+`;
 export const StyledRequiredFieldLegend = styled(Text)(({ theme }) => {
     const { base: { 'font-size': fontSize, 'font-scale': fontScale, palette: { urgent } } } = theme;
     const { xxs: infoFontSize } = calculateFontSize(fontSize, fontScale);
@@ -53,19 +58,21 @@ export const StyledRequiredFieldLegend = styled(Text)(({ theme }) => {
   `;
 });
 StyledRequiredFieldLegend.defaultProps = defaultThemeProp;
-const MultiStepForm = forwardRef(function MultiStepForm({ currentStepId, steps, heading, stepIndicator: stepIndicatorProp, progress, ...restProps }, ref) {
+const MultiStepForm = forwardRef(function MultiStepForm({ currentStepId, steps, heading, progress, stepIndicator: stepIndicatorProp, showStepNames = false, ...restProps }, ref) {
+    const showHorizontalStepNames = stepIndicatorProp === 'horizontal' ? showStepNames : undefined;
     const multiStepRef = useConsolidatedRef(ref);
     const headingRef = useRef(null);
     const progressIndicatorRef = useRef(null);
     const multiStepFormContentRef = useRef(null);
     const multiStepActionsRef = useRef(null);
+    const { loadedRef } = useConfiguration();
     const previousId = usePrevious(currentStepId);
     const currentStep = steps.find(step => step.id === currentStepId);
     const headingId = useUID();
     const descriptionId = useUID();
     const t = useI18n();
     const { base: { 'content-width': contentWidth } } = useTheme();
-    const isSmallOrAbove = useBreakpoint('sm');
+    const isSmallOrAbove = useBreakpoint('sm', { breakpointRef: multiStepRef });
     const stepIndicator = (() => {
         if (stepIndicatorProp === 'none' || steps.length < 2)
             return 'none';
@@ -74,6 +81,10 @@ const MultiStepForm = forwardRef(function MultiStepForm({ currentStepId, steps,
         return stepIndicatorProp ?? 'horizontal';
     })();
     const setFocus = () => {
+        if (!loadedRef.current) {
+            loadedRef.current = true;
+            return;
+        }
         if (progress)
             return;
         if (stepIndicator !== 'none' && progressIndicatorRef.current) {
@@ -126,6 +137,8 @@ const MultiStepForm = forwardRef(function MultiStepForm({ currentStepId, steps,
         }
     }, [progress]);
     let areaDef = '';
+    let rowDef = '';
+    let colDef = '';
     switch (stepIndicator) {
         case 'horizontal':
             areaDef += '"stepIndicator" ';
@@ -134,13 +147,28 @@ const MultiStepForm = forwardRef(function MultiStepForm({ currentStepId, steps,
             if (currentStep.description)
                 areaDef += '"description" ';
             areaDef += '"content"';
+            colDef = 'minmax(0, 1fr)';
             break;
         case 'vertical':
-            if (currentStep.banners)
+            if (currentStep.banners) {
                 areaDef += '"banners stepIndicator" ';
-            if (currentStep.description)
+                rowDef += 'auto ';
+            }
+            if (currentStep.description) {
                 areaDef += '"description stepIndicator" ';
+                rowDef += 'auto ';
+            }
             areaDef += '"content stepIndicator"';
+            rowDef += 'minmax(0px, 1fr)';
+            colDef = `2fr minmax(${contentWidth.xs}, 1fr)`;
+            break;
+        case 'vertical-start':
+            if (currentStep.banners)
+                areaDef += '"stepIndicator banners" ';
+            if (currentStep.description)
+                areaDef += '"stepIndicator description" ';
+            areaDef += '"stepIndicator content"';
+            colDef = 'fit-content(clamp(10ch, calc(100% / 3), 40ch)) 2fr';
             break;
         default:
             if (currentStep.banners)
@@ -148,16 +176,17 @@ const MultiStepForm = forwardRef(function MultiStepForm({ currentStepId, steps,
             if (currentStep.description)
                 areaDef += '"description" ';
             areaDef += '"content"';
+            colDef = 'minmax(0, 1fr)';
     }
     return (_jsxs(StyledForm, { ref: multiStepRef, ...restProps, "aria-labelledby": heading ? headingId : undefined, "aria-describedby": currentStep.description ? descriptionId : undefined, heading: !!heading, actions: !!currentStep.actions, children: [heading && (_jsx(Text, { ref: headingRef, id: headingId, variant: 'h3', children: heading })), _jsxs(Grid, { container: {
-                    cols: stepIndicator === 'vertical'
-                        ? `2fr minmax(${contentWidth.xs}, 1fr)`
-                        : 'minmax(0, 1fr)',
+                    cols: colDef,
+                    rows: rowDef,
                     areas: areaDef,
-                    gap: 2
-                }, inert: progress ? '' : undefined, children: [steps.length > 1 && (_jsxs(Grid, { ref: progressIndicatorRef, item: { area: 'stepIndicator' }, children: [stepIndicator === 'horizontal' && (_jsx(Grid, { item: { area: 'stepIndicator' }, as: HorizontalFormProgress, steps: steps, currentStepId: currentStepId })), stepIndicator === 'vertical' && (_jsx(Grid, { item: { area: 'stepIndicator' }, as: VerticalFormProgress, steps: steps, currentStepId: currentStepId })), _jsx(VisuallyHiddenText, { "aria-live": 'polite', children: previousId !== undefined && previousId !== currentStepId
+                    rowGap: 2,
+                    colGap: stepIndicator.startsWith('vertical') ? 4 : 2
+                }, inert: progress ? '' : undefined, children: [steps.length > 1 && (_jsxs(Grid, { ref: progressIndicatorRef, item: { area: 'stepIndicator' }, children: [stepIndicator === 'horizontal' && (_jsx(Grid, { item: { area: 'stepIndicator' }, as: HorizontalFormProgress, steps: steps, currentStepId: currentStepId, showStepNames: showHorizontalStepNames })), stepIndicator.startsWith('vertical') && (_jsx(Grid, { item: { area: 'stepIndicator' }, as: VerticalFormProgress, steps: steps, currentStepId: currentStepId })), _jsx(VisuallyHiddenText, { "aria-live": 'polite', children: previousId !== undefined && previousId !== currentStepId
                                     ? t('step_changed_to_name', [currentStep.name])
-                                    : '' })] })), currentStep.banners && _jsx(Grid, { item: { area: 'banners' }, children: currentStep.banners }), currentStep.description && (_jsx(Grid, { item: { area: 'description' }, children: _jsx(HTML, { id: descriptionId, as: 'p', content: currentStep.description }) })), _jsx(Grid, { item: { area: 'content' }, as: StyledFormContent, ref: multiStepFormContentRef, children: currentStep.content }), _jsx(Progress, { visible: !!progress, focusOnVisible: true, placement: 'local', message: typeof progress === 'string' ? progress : undefined })] }), currentStep.actions && (_jsx(ResponsiveActions, { actionsRef: multiStepActionsRef, actionsEl: currentStep.actions }))] }));
+                                    : '' })] })), currentStep.banners && _jsx(Grid, { item: { area: 'banners' }, children: currentStep.banners }), currentStep.description && (_jsx(StyledInstructionText, { item: { area: 'description' }, children: _jsx(HTML, { id: descriptionId, as: 'p', content: currentStep.description }) })), _jsx(Grid, { item: { area: 'content' }, as: StyledFormContent, ref: multiStepFormContentRef, children: currentStep.content }), _jsx(Progress, { visible: !!progress, focusOnVisible: true, placement: 'local', message: typeof progress === 'string' ? progress : undefined })] }), currentStep.actions && (_jsx(ResponsiveActions, { actionsRef: multiStepActionsRef, actionsEl: currentStep.actions }))] }));
 });
 export default MultiStepForm;
 //# sourceMappingURL=MultiStepForm.js.map

package/lib/components/MultiStepForm/MultiStepForm.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MultiStepForm.js","sourceRoot":"","sources":["../../../src/components/MultiStepForm/MultiStepForm.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useRef, useEffect } from 'react';\nimport type { PropsWithoutRef } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n useAfterInitialEffect,\n useUID,\n useI18n,\n usePrevious,\n useBreakpoint,\n useTheme,\n useConsolidatedRef\n} from '../../hooks';\nimport type { ForwardRefForwardPropsComponent } from '../../types';\nimport { focusNonInteractiveElement, isInstance } from '../../utils';\nimport { calculateFontSize } from '../../styles';\nimport Text from '../Text';\nimport HTML from '../HTML';\nimport VisuallyHiddenText from '../VisuallyHiddenText';\nimport Grid, { StyledGrid } from '../Grid';\nimport { defaultThemeProp } from '../../theme';\nimport Progress from '../Progress';\nimport ResponsiveActions from '../ResponsiveActions';\n\nimport type MultiStepFormProps from './MultiStepForm.types';\nimport VerticalFormProgress from './VerticalFormProgress';\nimport HorizontalFormProgress from './HorizontalFormProgress';\n\nexport const StyledForm = styled.form<{ actions?: boolean; heading?: boolean }>(\n ({ actions, heading, theme }) => {\n return css`\n & > ${StyledGrid} {\n position: relative;\n\n ${actions &&\n css`\n padding-block-end: calc(2 * ${theme.base.spacing});\n `}\n\n ${heading &&\n css`\n padding-block-start: calc(2 * ${theme.base.spacing});\n `}\n }\n\n &:focus-visible {\n outline: none;\n box-shadow: ${theme.base.shadow.focus};\n }\n `;\n }\n);\n\nStyledForm.defaultProps = defaultThemeProp;\n\nexport const StyledFormContent = styled.div``;\n\nexport const StyledRequiredFieldLegend = styled(Text)(({ theme }) => {\n const {\n base: {\n 'font-size': fontSize,\n 'font-scale': fontScale,\n palette: { urgent }\n }\n } = theme;\n const { xxs: infoFontSize } = calculateFontSize(fontSize, fontScale);\n\n return css`\n font-size: ${infoFontSize};\n font-style: italic;\n\n &::before {\n display: 'inline';\n content: '\\\\00a0*';\n vertical-align: top;\n color: ${urgent};\n }\n `;\n});\n\nStyledRequiredFieldLegend.defaultProps = defaultThemeProp;\n\nconst MultiStepForm: ForwardRefForwardPropsComponent<MultiStepFormProps> = forwardRef(\n function MultiStepForm(\n {\n currentStepId,\n steps,\n heading,\n stepIndicator: stepIndicatorProp,\n progress,\n ...restProps\n }: PropsWithoutRef<MultiStepFormProps>,\n ref: MultiStepFormProps['ref']\n ) {\n const multiStepRef = useConsolidatedRef<HTMLFormElement>(ref);\n const headingRef = useRef<HTMLHeadingElement>(null);\n const progressIndicatorRef = useRef<HTMLDivElement>(null);\n const multiStepFormContentRef = useRef<HTMLDivElement>(null);\n const multiStepActionsRef = useRef<HTMLDivElement>(null);\n\n const previousId = usePrevious(currentStepId);\n const currentStep = steps.find(step => step.id === currentStepId)!;\n const headingId = useUID();\n const descriptionId = useUID();\n const t = useI18n();\n const {\n base: { 'content-width': contentWidth }\n } = useTheme();\n\n const isSmallOrAbove = useBreakpoint('sm');\n\n const stepIndicator = (() => {\n if (stepIndicatorProp === 'none' \|\| steps.length < 2) return 'none';\n\n if (!isSmallOrAbove) return 'horizontal';\n\n return stepIndicatorProp ?? 'horizontal';\n })();\n\n const setFocus = () => {\n if (progress) return;\n\n if (stepIndicator !== 'none' && progressIndicatorRef.current) {\n const focusables = [\n ...progressIndicatorRef.current.querySelectorAll(`[id=\"${currentStepId}\"]`)\n ] as HTMLElement[];\n focusables[0]?.focus();\n } else if (headingRef.current) {\n focusNonInteractiveElement(headingRef.current);\n } else if (multiStepRef.current) {\n const containerEl = multiStepRef.current.closest('[data-focusable-form-container]');\n const headingEl = containerEl?.querySelector('[data-focusable-form-heading]');\n if (isInstance(headingEl, HTMLElement)) {\n focusNonInteractiveElement(headingEl);\n } else {\n let label: string \| undefined;\n if (heading && currentStep.name) {\n label = `${heading} - ${currentStep.name}`;\n } else if (currentStep.name) {\n label = currentStep.name;\n } else if (heading) {\n label = heading;\n }\n\n focusNonInteractiveElement(multiStepRef.current, label);\n }\n }\n };\n\n // Set focus if the current step id updates\n useEffect(() => {\n if (previousId !== currentStepId) {\n setFocus();\n }\n }, [currentStepId, previousId]);\n\n // Set focus if the form content updates while focus is within the actions region of the form\n useAfterInitialEffect(() => {\n if (\n multiStepActionsRef.current &&\n multiStepActionsRef.current.contains(document.activeElement)\n ) {\n setFocus();\n }\n }, [currentStep.content]);\n\n // Set focus if a progress state resolves\n useAfterInitialEffect(() => {\n if (!progress) {\n setFocus();\n }\n }, [progress]);\n\n let areaDef = '';\n switch (stepIndicator) {\n case 'horizontal':\n areaDef += '\"stepIndicator\" ';\n if (currentStep.banners) areaDef += '\"banners\" ';\n if (currentStep.description) areaDef += '\"description\" ';\n areaDef += '\"content\"';\n break;\n case 'vertical':\n if (currentStep.banners) areaDef += '\"banners stepIndicator\" ';\n if (currentStep.description) areaDef += '\"description stepIndicator\" ';\n areaDef += '\"content stepIndicator\"';\n break;\n default:\n if (currentStep.banners) areaDef += '\"banners\" ';\n if (currentStep.description) areaDef += '\"description\" ';\n areaDef += '\"content\"';\n }\n\n return (\n <StyledForm\n ref={multiStepRef}\n {...restProps}\n aria-labelledby={heading ? headingId : undefined}\n aria-describedby={currentStep.description ? descriptionId : undefined}\n heading={!!heading}\n actions={!!currentStep.actions}\n >\n {heading && (\n <Text ref={headingRef} id={headingId} variant='h3'>\n {heading}\n </Text>\n )}\n\n <Grid\n container={{\n cols:\n stepIndicator === 'vertical'\n ? `2fr minmax(${contentWidth.xs}, 1fr)`\n : 'minmax(0, 1fr)',\n areas: areaDef,\n gap: 2\n }}\n inert={progress ? '' : undefined}\n >\n {steps.length > 1 && (\n <Grid ref={progressIndicatorRef} item={{ area: 'stepIndicator' }}>\n {stepIndicator === 'horizontal' && (\n <Grid\n item={{ area: 'stepIndicator' }}\n as={HorizontalFormProgress}\n steps={steps}\n currentStepId={currentStepId}\n />\n )}\n {stepIndicator === 'vertical' && (\n <Grid\n item={{ area: 'stepIndicator' }}\n as={VerticalFormProgress}\n steps={steps}\n currentStepId={currentStepId}\n />\n )}\n <VisuallyHiddenText aria-live='polite'>\n {previousId !== undefined && previousId !== currentStepId\n ? t('step_changed_to_name', [currentStep.name])\n : ''}\n </VisuallyHiddenText>\n </Grid>\n )}\n\n {currentStep.banners && <Grid item={{ area: 'banners' }}>{currentStep.banners}</Grid>}\n\n {currentStep.description && (\n <Grid item={{ area: 'description' }}>\n <HTML id={descriptionId} as='p' content={currentStep.description} />\n </Grid>\n )}\n\n <Grid item={{ area: 'content' }} as={StyledFormContent} ref={multiStepFormContentRef}>\n {currentStep.content}\n </Grid>\n\n <Progress\n visible={!!progress}\n focusOnVisible\n placement='local'\n message={typeof progress === 'string' ? progress : undefined}\n />\n </Grid>\n {currentStep.actions && (\n <ResponsiveActions actionsRef={multiStepActionsRef} actionsEl={currentStep.actions} />\n )}\n </StyledForm>\n );\n }\n);\n\nexport default MultiStepForm;\n"]}
1	+ {"version":3,"file":"MultiStepForm.js","sourceRoot":"","sources":["../../../src/components/MultiStepForm/MultiStepForm.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useRef, useEffect } from 'react';\nimport type { PropsWithoutRef } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n useAfterInitialEffect,\n useUID,\n useI18n,\n usePrevious,\n useBreakpoint,\n useTheme,\n useConsolidatedRef,\n useConfiguration\n} from '../../hooks';\nimport type { ForwardRefForwardPropsComponent } from '../../types';\nimport { focusNonInteractiveElement, isInstance } from '../../utils';\nimport { calculateFontSize } from '../../styles';\nimport Text from '../Text';\nimport HTML from '../HTML';\nimport VisuallyHiddenText from '../VisuallyHiddenText';\nimport Grid, { StyledGrid } from '../Grid';\nimport { defaultThemeProp } from '../../theme';\nimport Progress from '../Progress';\nimport ResponsiveActions from '../ResponsiveActions';\n\nimport type { MultiStepFormProps } from './MultiStepForm.types';\nimport VerticalFormProgress from './VerticalFormProgress';\nimport HorizontalFormProgress from './HorizontalFormProgress';\n\nexport const StyledForm = styled.form<{ actions?: boolean; heading?: boolean }>(\n ({ actions, heading, theme }) => {\n return css`\n & > ${StyledGrid} {\n position: relative;\n\n ${actions &&\n css`\n padding-block-end: calc(2 * ${theme.base.spacing});\n `}\n\n ${heading &&\n css`\n padding-block-start: calc(2 * ${theme.base.spacing});\n `}\n }\n\n &:focus-visible {\n outline: none;\n box-shadow: ${theme.base.shadow.focus};\n }\n `;\n }\n);\n\nStyledForm.defaultProps = defaultThemeProp;\n\nexport const StyledFormContent = styled.div``;\n\nexport const StyledInstructionText = styled(Grid)`\n /* Prevent instruction text from contributing to modal width calculation /\n width: 0;\n min-width: 100%;\n`;\n\nexport const StyledRequiredFieldLegend = styled(Text)(({ theme }) => {\n const {\n base: {\n 'font-size': fontSize,\n 'font-scale': fontScale,\n palette: { urgent }\n }\n } = theme;\n const { xxs: infoFontSize } = calculateFontSize(fontSize, fontScale);\n\n return css`\n font-size: ${infoFontSize};\n font-style: italic;\n\n &::before {\n display: 'inline';\n content: '\\\\00a0';\n vertical-align: top;\n color: ${urgent};\n }\n `;\n});\n\nStyledRequiredFieldLegend.defaultProps = defaultThemeProp;\n\nconst MultiStepForm: ForwardRefForwardPropsComponent<MultiStepFormProps> = forwardRef(\n function MultiStepForm(\n {\n currentStepId,\n steps,\n heading,\n progress,\n stepIndicator: stepIndicatorProp,\n showStepNames = false,\n ...restProps\n }: PropsWithoutRef<MultiStepFormProps>,\n ref: MultiStepFormProps['ref']\n ) {\n const showHorizontalStepNames = stepIndicatorProp === 'horizontal' ? showStepNames : undefined;\n\n const multiStepRef = useConsolidatedRef<HTMLFormElement>(ref);\n const headingRef = useRef<HTMLHeadingElement>(null);\n const progressIndicatorRef = useRef<HTMLDivElement>(null);\n const multiStepFormContentRef = useRef<HTMLDivElement>(null);\n const multiStepActionsRef = useRef<HTMLDivElement>(null);\n\n const { loadedRef } = useConfiguration();\n const previousId = usePrevious(currentStepId);\n const currentStep = steps.find(step => step.id === currentStepId)!;\n const headingId = useUID();\n const descriptionId = useUID();\n const t = useI18n();\n const {\n base: { 'content-width': contentWidth }\n } = useTheme();\n\n const isSmallOrAbove = useBreakpoint('sm', { breakpointRef: multiStepRef });\n\n const stepIndicator = (() => {\n if (stepIndicatorProp === 'none' \|\| steps.length < 2) return 'none';\n\n if (!isSmallOrAbove) return 'horizontal';\n\n return stepIndicatorProp ?? 'horizontal';\n })();\n\n const setFocus = () => {\n if (!loadedRef.current) {\n loadedRef.current = true;\n return;\n }\n\n if (progress) return;\n\n if (stepIndicator !== 'none' && progressIndicatorRef.current) {\n const focusables = [\n ...progressIndicatorRef.current.querySelectorAll(`[id=\"${currentStepId}\"]`)\n ] as HTMLElement[];\n focusables[0]?.focus();\n } else if (headingRef.current) {\n focusNonInteractiveElement(headingRef.current);\n } else if (multiStepRef.current) {\n const containerEl = multiStepRef.current.closest('[data-focusable-form-container]');\n const headingEl = containerEl?.querySelector('[data-focusable-form-heading]');\n if (isInstance(headingEl, HTMLElement)) {\n focusNonInteractiveElement(headingEl);\n } else {\n let label: string \| undefined;\n if (heading && currentStep.name) {\n label = `${heading} - ${currentStep.name}`;\n } else if (currentStep.name) {\n label = currentStep.name;\n } else if (heading) {\n label = heading;\n }\n\n focusNonInteractiveElement(multiStepRef.current, label);\n }\n }\n };\n\n // Set focus if the current step id updates\n useEffect(() => {\n if (previousId !== currentStepId) {\n setFocus();\n }\n }, [currentStepId, previousId]);\n\n // Set focus if the form content updates while focus is within the actions region of the form\n useAfterInitialEffect(() => {\n if (\n multiStepActionsRef.current &&\n multiStepActionsRef.current.contains(document.activeElement)\n ) {\n setFocus();\n }\n }, [currentStep.content]);\n\n // Set focus if a progress state resolves\n useAfterInitialEffect(() => {\n if (!progress) {\n setFocus();\n }\n }, [progress]);\n\n let areaDef = '';\n let rowDef = '';\n let colDef = '';\n switch (stepIndicator) {\n case 'horizontal':\n areaDef += '\"stepIndicator\" ';\n if (currentStep.banners) areaDef += '\"banners\" ';\n if (currentStep.description) areaDef += '\"description\" ';\n areaDef += '\"content\"';\n colDef = 'minmax(0, 1fr)';\n break;\n case 'vertical':\n if (currentStep.banners) {\n areaDef += '\"banners stepIndicator\" ';\n rowDef += 'auto ';\n }\n if (currentStep.description) {\n areaDef += '\"description stepIndicator\" ';\n rowDef += 'auto ';\n }\n areaDef += '\"content stepIndicator\"';\n rowDef += 'minmax(0px, 1fr)';\n colDef = `2fr minmax(${contentWidth.xs}, 1fr)`;\n break;\n case 'vertical-start':\n if (currentStep.banners) areaDef += '\"stepIndicator banners\" ';\n if (currentStep.description) areaDef += '\"stepIndicator description\" ';\n areaDef += '\"stepIndicator content\"';\n colDef = 'fit-content(clamp(10ch, calc(100% / 3), 40ch)) 2fr';\n break;\n default:\n if (currentStep.banners) areaDef += '\"banners\" ';\n if (currentStep.description) areaDef += '\"description\" ';\n areaDef += '\"content\"';\n colDef = 'minmax(0, 1fr)';\n }\n\n return (\n <StyledForm\n ref={multiStepRef}\n {...restProps}\n aria-labelledby={heading ? headingId : undefined}\n aria-describedby={currentStep.description ? descriptionId : undefined}\n heading={!!heading}\n actions={!!currentStep.actions}\n >\n {heading && (\n <Text ref={headingRef} id={headingId} variant='h3'>\n {heading}\n </Text>\n )}\n\n <Grid\n container={{\n cols: colDef,\n rows: rowDef,\n areas: areaDef,\n rowGap: 2,\n colGap: stepIndicator.startsWith('vertical') ? 4 : 2\n }}\n inert={progress ? '' : undefined}\n >\n {steps.length > 1 && (\n <Grid ref={progressIndicatorRef} item={{ area: 'stepIndicator' }}>\n {stepIndicator === 'horizontal' && (\n <Grid\n item={{ area: 'stepIndicator' }}\n as={HorizontalFormProgress}\n steps={steps}\n currentStepId={currentStepId}\n showStepNames={showHorizontalStepNames}\n />\n )}\n {stepIndicator.startsWith('vertical') && (\n <Grid\n item={{ area: 'stepIndicator' }}\n as={VerticalFormProgress}\n steps={steps}\n currentStepId={currentStepId}\n />\n )}\n <VisuallyHiddenText aria-live='polite'>\n {previousId !== undefined && previousId !== currentStepId\n ? t('step_changed_to_name', [currentStep.name])\n : ''}\n </VisuallyHiddenText>\n </Grid>\n )}\n\n {currentStep.banners && <Grid item={{ area: 'banners' }}>{currentStep.banners}</Grid>}\n\n {currentStep.description && (\n <StyledInstructionText item={{ area: 'description' }}>\n <HTML id={descriptionId} as='p' content={currentStep.description} />\n </StyledInstructionText>\n )}\n\n <Grid item={{ area: 'content' }} as={StyledFormContent} ref={multiStepFormContentRef}>\n {currentStep.content}\n </Grid>\n\n <Progress\n visible={!!progress}\n focusOnVisible\n placement='local'\n message={typeof progress === 'string' ? progress : undefined}\n />\n </Grid>\n {currentStep.actions && (\n <ResponsiveActions actionsRef={multiStepActionsRef} actionsEl={currentStep.actions} />\n )}\n </StyledForm>\n );\n }\n);\n\nexport default MultiStepForm;\n"]}

package/lib/components/MultiStepForm/MultiStepForm.types.d.ts CHANGED Viewed

@@ -28,6 +28,11 @@ export interface Step {
     banners?: BaseFormProps['banners'];
     /** Content to render for the step. */
     content?: BaseFormProps['content'];
+    /**
+     * Indicates whether the step has been completed
+     * @default false
+     */
+    completed?: boolean;
     /**
      * Determines the size of the step indicator. Depth 0 is larger than depth 1.
      * @default 0
@@ -38,16 +43,11 @@ export interface Step {
     /** Callback function that is called when a step marker is clicked. */
     onMarkerClick?: MouseEventHandler;
 }
-export default interface MultiStepFormProps {
+interface BaseMultiStepFormProps {
     /** Sets the current step. */
     currentStepId: string;
     /** Flat array of objects describing each step. */
     steps: Step[];
-    /**
-     * MultiStepForm step indicator.
-     * @default 'horizontal'
-     */
-    stepIndicator?: 'horizontal' | 'vertical' | 'none';
     /** Progress state for the form. */
     progress?: BaseFormProps['progress'];
     /** The heading of the form. */
@@ -55,4 +55,18 @@ export default interface MultiStepFormProps {
     /** Ref forwarded to the form element. */
     ref?: BaseFormProps['ref'];
 }
+export type MultiStepFormProps = BaseMultiStepFormProps & ({
+    /** MultiStepForm step indicator type - horizontal */
+    stepIndicator?: 'horizontal';
+    /**
+     * Whether to show all step names in the horizontal step indicator.
+     * @default false
+     */
+    showStepNames?: boolean;
+} | {
+    /** MultiStepForm step indicator type */
+    stepIndicator: 'vertical' | 'vertical-start' | 'none';
+    showStepNames?: never;
+});
+export {};
 //# sourceMappingURL=MultiStepForm.types.d.ts.map

package/lib/components/MultiStepForm/MultiStepForm.types.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MultiStepForm.types.d.ts","sourceRoot":"","sources":["../../../src/components/MultiStepForm/MultiStepForm.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,GAAG,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAE/D,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAC7C,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAEjD,MAAM,WAAW,aAAc,SAAQ,SAAS;IAC9C,4BAA4B;IAC5B,OAAO,EAAE,SAAS,CAAC;IACnB,+BAA+B;IAC/B,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,sIAAsI;IACtI,QAAQ,CAAC,EAAE,OAAO,GAAG,aAAa,CAAC,SAAS,CAAC,CAAC;IAC9C,yCAAyC;IACzC,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,oEAAoE;IACpE,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,+BAA+B;IAC/B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,yCAAyC;IACzC,GAAG,CAAC,EAAE,GAAG,CAAC,eAAe,CAAC,CAAC;CAC5B;AAED,MAAM,WAAW,IAAI;IACnB,sEAAsE;IACtE,EAAE,EAAE,MAAM,CAAC;IACX,sCAAsC;IACtC,IAAI,EAAE,MAAM,CAAC;IACb,sDAAsD;IACtD,OAAO,CAAC,EAAE,aAAa,CAAC,SAAS,CAAC,CAAC;IACnC,qCAAqC;IACrC,OAAO,CAAC,EAAE,aAAa,CAAC,SAAS,CAAC,CAAC;IACnC,sCAAsC;IACtC,OAAO,CAAC,EAAE,aAAa,CAAC,SAAS,CAAC,CAAC;IACnC;;;OAGG;IACH,KAAK,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC;IACd,oEAAoE;IACpE,WAAW,CAAC,EAAE,aAAa,CAAC,aAAa,CAAC,CAAC;IAC3C,sEAAsE;IACtE,aAAa,CAAC,EAAE,iBAAiB,CAAC;CACnC;AAED,~~MAAM~~,~~CAAC,OAAO,WAAW,kBAAkB~~;~~IACzC~~,6BAA6B;IAC7B,aAAa,EAAE,MAAM,CAAC;IACtB,kDAAkD;IAClD,KAAK,EAAE,IAAI,EAAE,CAAC;IACd~~;;;OAGG;IACH~~,~~aAAa,CAAC,EAAE,YAAY,GAAG,UAAU,GAAG,MAAM,CAAC;IACnD,~~mCAAmC;IACnC,QAAQ,CAAC,EAAE,aAAa,CAAC,UAAU,CAAC,CAAC;IACrC,+BAA+B;IAC/B,OAAO,CAAC,EAAE,aAAa,CAAC,SAAS,CAAC,CAAC;IACnC,yCAAyC;IACzC,GAAG,CAAC,EAAE,aAAa,CAAC,KAAK,CAAC,CAAC;CAC5B"}
1	+ {"version":3,"file":"MultiStepForm.types.d.ts","sourceRoot":"","sources":["../../../src/components/MultiStepForm/MultiStepForm.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,GAAG,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAE/D,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAC7C,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAEjD,MAAM,WAAW,aAAc,SAAQ,SAAS;IAC9C,4BAA4B;IAC5B,OAAO,EAAE,SAAS,CAAC;IACnB,+BAA+B;IAC/B,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,sIAAsI;IACtI,QAAQ,CAAC,EAAE,OAAO,GAAG,aAAa,CAAC,SAAS,CAAC,CAAC;IAC9C,yCAAyC;IACzC,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,oEAAoE;IACpE,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,+BAA+B;IAC/B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,yCAAyC;IACzC,GAAG,CAAC,EAAE,GAAG,CAAC,eAAe,CAAC,CAAC;CAC5B;AAED,MAAM,WAAW,IAAI;IACnB,sEAAsE;IACtE,EAAE,EAAE,MAAM,CAAC;IACX,sCAAsC;IACtC,IAAI,EAAE,MAAM,CAAC;IACb,sDAAsD;IACtD,OAAO,CAAC,EAAE,aAAa,CAAC,SAAS,CAAC,CAAC;IACnC,qCAAqC;IACrC,OAAO,CAAC,EAAE,aAAa,CAAC,SAAS,CAAC,CAAC;IACnC,sCAAsC;IACtC,OAAO,CAAC,EAAE,aAAa,CAAC,SAAS,CAAC,CAAC;IACnC;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;OAGG;IACH,KAAK,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC;IACd,oEAAoE;IACpE,WAAW,CAAC,EAAE,aAAa,CAAC,aAAa,CAAC,CAAC;IAC3C,sEAAsE;IACtE,aAAa,CAAC,EAAE,iBAAiB,CAAC;CACnC;AAED,UAAU,sBAAsB;IAC9B,6BAA6B;IAC7B,aAAa,EAAE,MAAM,CAAC;IACtB,kDAAkD;IAClD,KAAK,EAAE,IAAI,EAAE,CAAC;IACd,mCAAmC;IACnC,QAAQ,CAAC,EAAE,aAAa,CAAC,UAAU,CAAC,CAAC;IACrC,+BAA+B;IAC/B,OAAO,CAAC,EAAE,aAAa,CAAC,SAAS,CAAC,CAAC;IACnC,yCAAyC;IACzC,GAAG,CAAC,EAAE,aAAa,CAAC,KAAK,CAAC,CAAC;CAC5B;AAED,MAAM,MAAM,kBAAkB,GAAG,sBAAsB,GACrD,CACI;IACE,qDAAqD;IACrD,aAAa,CAAC,EAAE,YAAY,CAAC;IAC7B;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB,GACD;IACE,wCAAwC;IACxC,aAAa,EAAE,UAAU,GAAG,gBAAgB,GAAG,MAAM,CAAC;IACtD,aAAa,CAAC,EAAE,KAAK,CAAC;CACvB,CACJ,CAAC"}