@ultraviolet/ui 3.9.0 → 3.10.0

package/dist/components/compositions/Plans/styles.css.js

@@ -0,0 +1,39 @@
+/* empty css                      */
+import { createRuntimeFn } from "@vanilla-extract/recipes/createRuntimeFn";
+
+//#region src/components/compositions/Plans/styles.css.ts
+var plansIconWrapper = "uv_4bym9s0";
+var plans = "uv_4bym9s1";
+var plansOutOfStockBadge = "uv_4bym9s2";
+var plansCell = createRuntimeFn({
+	defaultClassName: "uv_4bym9s3",
+	variantClassNames: {
+		activeColor: { true: "uv_4bym9s4" },
+		disabled: { true: "uv_4bym9s5" },
+		focus: { true: "uv_4bym9s6" },
+		hide: { true: "uv_4bym9s7" },
+		hideLabels: { true: "uv_4bym9s8" },
+		selectable: { true: "uv_4bym9s9" },
+		spaceAfter: { true: "uv_4bym9sa" }
+	},
+	defaultVariants: {
+		activeColor: false,
+		disabled: false,
+		focus: false,
+		hide: false,
+		hideLabels: false,
+		selectable: false,
+		spaceAfter: false
+	},
+	compoundVariants: []
+});
+var plansRowHidden = "uv_4bym9sb";
+var plansUppercaseText = "uv_4bym9sc";
+var plansHeaderInput = "uv_4bym9sd";
+var plansHeaderFullHeight = "uv_4bym9se";
+var plansDescription = "uv_4bym9sf";
+var plansFullSizeSeparator = "uv_4bym9sg";
+var plansCurrentWrapper = "uv_4bym9sh";
+
+//#endregion
+export { plans, plansCell, plansCurrentWrapper, plansDescription, plansFullSizeSeparator, plansHeaderFullHeight, plansHeaderInput, plansIconWrapper, plansOutOfStockBadge, plansRowHidden, plansUppercaseText };

package/dist/components/compositions/Plans/types.d.ts

@@ -0,0 +1,38 @@
+import type { ComponentProps, ReactNode } from 'react';
+import type { Text } from '../../Text';
+export type Hint = {
+    type: 'tooltip';
+    text: string;
+} | {
+    type: 'popover';
+    title: string;
+    content: ReactNode;
+};
+export type PlanType<T extends string> = {
+    value: string;
+    title: string;
+    titleHeader?: ReactNode;
+    sentiment?: ComponentProps<typeof Text>['sentiment'];
+    header: {
+        description?: ReactNode;
+        price: string;
+        quotas?: string;
+        priceDescription?: string;
+        cta?: ReactNode;
+        separator?: ReactNode;
+    };
+    outOfStock?: boolean;
+    disabled?: boolean;
+    data: Record<T, string | number | undefined | ReactNode>;
+};
+export type Feature<T extends string> = {
+    key: T;
+    text: string;
+    description?: string;
+    spaceAfter?: boolean;
+    hint?: Hint;
+} | {
+    group: string;
+    hint?: Hint;
+};
+//# sourceMappingURL=types.d.ts.map

package/dist/components/compositions/Plans/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/compositions/Plans/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACtD,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,YAAY,CAAA;AAEtC,MAAM,MAAM,IAAI,GACZ;IACE,IAAI,EAAE,SAAS,CAAA;IACf,IAAI,EAAE,MAAM,CAAA;CACb,GACD;IACE,IAAI,EAAE,SAAS,CAAA;IACf,KAAK,EAAE,MAAM,CAAA;IACb,OAAO,EAAE,SAAS,CAAA;CACnB,CAAA;AAEL,MAAM,MAAM,QAAQ,CAAC,CAAC,SAAS,MAAM,IAAI;IACvC,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,MAAM,CAAA;IACb,WAAW,CAAC,EAAE,SAAS,CAAA;IACvB,SAAS,CAAC,EAAE,cAAc,CAAC,OAAO,IAAI,CAAC,CAAC,WAAW,CAAC,CAAA;IACpD,MAAM,EAAE;QACN,WAAW,CAAC,EAAE,SAAS,CAAA;QACvB,KAAK,EAAE,MAAM,CAAA;QACb,MAAM,CAAC,EAAE,MAAM,CAAA;QACf,gBAAgB,CAAC,EAAE,MAAM,CAAA;QACzB,GAAG,CAAC,EAAE,SAAS,CAAA;QACf,SAAS,CAAC,EAAE,SAAS,CAAA;KACtB,CAAA;IACD,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,IAAI,EAAE,MAAM,CAAC,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,CAAC,CAAA;CACzD,CAAA;AAED,MAAM,MAAM,OAAO,CAAC,CAAC,SAAS,MAAM,IAChC;IACE,GAAG,EAAE,CAAC,CAAA;IACN,IAAI,EAAE,MAAM,CAAA;IACZ,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,IAAI,CAAC,EAAE,IAAI,CAAA;CACZ,GACD;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,IAAI,CAAC,EAAE,IAAI,CAAA;CAAE,CAAA"}

package/dist/components/compositions/SteppedListCard/Step.d.ts

@@ -0,0 +1,23 @@
+import type { ReactNode } from 'react';
+type StepProps = {
+    /**
+     * The number of the step, max 5 steps.
+     */
+    stepNumber: number;
+    /**
+     * An icon to replace the step number in the bullet
+     */
+    stepIcon?: ReactNode;
+    /**
+     * Title of the step
+     */
+    stepTitle: string;
+    /**
+     * State of the step
+     */
+    completed: boolean;
+    'data-testid'?: string;
+};
+export declare const SteppedList: ({ stepNumber, stepTitle, completed, stepIcon, 'data-testid': dataTestId, }: StepProps) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=Step.d.ts.map

package/dist/components/compositions/SteppedListCard/Step.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Step.d.ts","sourceRoot":"","sources":["../../../../src/components/compositions/SteppedListCard/Step.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAOtC,KAAK,SAAS,GAAG;IACf;;OAEG;IACH,UAAU,EAAE,MAAM,CAAA;IAClB;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB;;OAEG;IACH,SAAS,EAAE,MAAM,CAAA;IACjB;;OAEG;IACH,SAAS,EAAE,OAAO,CAAA;IAClB,aAAa,CAAC,EAAE,MAAM,CAAA;CACvB,CAAA;AAED,eAAO,MAAM,WAAW,oIA+CvB,CAAA"}

package/dist/components/compositions/SteppedListCard/Step.js

@@ -0,0 +1,47 @@
+'use client';
+import { __name } from "../../../_virtual/_rolldown/runtime.js";
+import { Text } from "../../Text/index.js";
+import { StepList } from "../../StepList/index.js";
+import { Data } from "./helper.js";
+import { steppedListCardStep, steppedListCardStepTitle } from "./styles.css.js";
+import { useContext } from "react";
+import { jsx } from "react/jsx-runtime";
+import { CheckIcon } from "@ultraviolet/icons/CheckIcon";
+
+//#region src/components/compositions/SteppedListCard/Step.tsx
+const SteppedList = ({ stepNumber, stepTitle, completed, stepIcon, "data-testid": dataTestId }) => {
+	const containerData = useContext(Data);
+	const active = containerData.currentStep === stepNumber;
+	return completed ? /* @__PURE__ */ jsx(StepList.Item, {
+		bulletContent: /* @__PURE__ */ jsx(CheckIcon, {}),
+		className: steppedListCardStep,
+		"data-testid": dataTestId,
+		onClick: () => containerData.setCurrentStep(stepNumber),
+		prominence: active ? "strong" : "default",
+		sentiment: "primary",
+		size: "small",
+		children: /* @__PURE__ */ jsx(Text, {
+			as: "h3",
+			className: steppedListCardStepTitle,
+			variant: active ? "bodyStrong" : "body",
+			children: stepTitle
+		})
+	}) : /* @__PURE__ */ jsx(StepList.Item, {
+		bulletContent: stepIcon !== null && stepIcon !== void 0 ? stepIcon : String(stepNumber),
+		className: steppedListCardStep,
+		"data-testid": dataTestId,
+		onClick: () => containerData.setCurrentStep(stepNumber),
+		prominence: active ? "strong" : void 0,
+		sentiment: active ? "primary" : void 0,
+		size: "small",
+		children: /* @__PURE__ */ jsx(Text, {
+			as: "h3",
+			className: steppedListCardStepTitle,
+			variant: active ? "bodyStrong" : "body",
+			children: stepTitle
+		})
+	});
+};
+
+//#endregion
+export { SteppedList };

package/dist/components/compositions/SteppedListCard/SteppedListContent.d.ts

@@ -0,0 +1,12 @@
+import type { CSSProperties, ReactNode } from 'react';
+type SteppedListContentProps = {
+    subHeader?: ReactNode;
+    children: ((nextStep: (completed?: boolean) => void) => ReactNode) | ReactNode;
+    image?: ReactNode;
+    stepNumber: number;
+    completed?: boolean;
+    style?: CSSProperties;
+};
+export declare const SteppedListContent: ({ subHeader, children, image, stepNumber, completed, style, }: SteppedListContentProps) => import("react/jsx-runtime").JSX.Element | null;
+export {};
+//# sourceMappingURL=SteppedListContent.d.ts.map

package/dist/components/compositions/SteppedListCard/SteppedListContent.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SteppedListContent.d.ts","sourceRoot":"","sources":["../../../../src/components/compositions/SteppedListCard/SteppedListContent.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAWrD,KAAK,uBAAuB,GAAG;IAC7B,SAAS,CAAC,EAAE,SAAS,CAAA;IACrB,QAAQ,EAAE,CAAC,CAAC,QAAQ,EAAE,CAAC,SAAS,CAAC,EAAE,OAAO,KAAK,IAAI,KAAK,SAAS,CAAC,GAAG,SAAS,CAAA;IAC9E,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,UAAU,EAAE,MAAM,CAAA;IAClB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,KAAK,CAAC,EAAE,aAAa,CAAA;CACtB,CAAA;AACD,eAAO,MAAM,kBAAkB,4IA2D9B,CAAA"}

package/dist/components/compositions/SteppedListCard/SteppedListContent.js

@@ -0,0 +1,56 @@
+'use client';
+import { __name } from "../../../_virtual/_rolldown/runtime.js";
+import { Stack } from "../../Stack/index.js";
+import { Text } from "../../Text/index.js";
+import { Data, nextStep } from "./helper.js";
+import { steppedListCardContent, steppedListCardImage, steppedListCardSubHeader } from "./styles.css.js";
+import { useContext, useEffect } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/components/compositions/SteppedListCard/SteppedListContent.tsx
+const SteppedListContent = ({ subHeader, children, image, stepNumber, completed = false, style }) => {
+	const { setDone, currentStep, done, setCurrentStep, numberOfSteps, setHidden, onClickHide } = useContext(Data);
+	useEffect(() => {
+		setDone((prevDone) => {
+			const updatedDone = [...prevDone];
+			updatedDone[stepNumber - 1] = completed;
+			return updatedDone;
+		});
+	}, [
+		completed,
+		setDone,
+		stepNumber
+	]);
+	if (stepNumber === currentStep) return /* @__PURE__ */ jsxs(Stack, {
+		className: steppedListCardContent,
+		style,
+		children: [
+			/* @__PURE__ */ jsx("div", {
+				className: steppedListCardSubHeader,
+				children: typeof subHeader === "string" ? /* @__PURE__ */ jsx(Text, {
+					as: "h3",
+					variant: "headingSmallStrong",
+					children: subHeader
+				}) : subHeader
+			}),
+			typeof children === "function" ? children((completedArg) => nextStep({
+				completed: completedArg,
+				done,
+				numberOfSteps,
+				onClickHide,
+				setCompleted: setDone,
+				setCurrentStep,
+				setHidden,
+				stepNumber
+			})) : children,
+			/* @__PURE__ */ jsx("div", {
+				className: steppedListCardImage,
+				children: image
+			})
+		]
+	});
+	return null;
+};
+
+//#endregion
+export { SteppedListContent };

package/dist/components/compositions/SteppedListCard/helper.d.ts

@@ -0,0 +1,27 @@
+type ContextType = {
+    currentStep: number;
+    setCurrentStep: React.Dispatch<React.SetStateAction<number>>;
+    numberOfSteps: number;
+    done: boolean[];
+    setDone: React.Dispatch<React.SetStateAction<boolean[]>>;
+    setHidden: React.Dispatch<React.SetStateAction<boolean>>;
+    onClickHide?: () => void;
+};
+export declare const Data: import("react").Context<ContextType>;
+type NextStepProps = {
+    completed?: boolean;
+    setCompleted: React.Dispatch<React.SetStateAction<boolean[]>>;
+    stepNumber: number;
+    setCurrentStep: React.Dispatch<React.SetStateAction<number>>;
+    numberOfSteps: number;
+    setHidden: React.Dispatch<React.SetStateAction<boolean>>;
+    done: boolean[];
+    onClickHide?: () => void;
+};
+/**
+ * Go to next step with or without validation of the current step
+ * Close the component for the last step
+ */
+export declare const nextStep: ({ completed, setCompleted, stepNumber, setCurrentStep, numberOfSteps, setHidden, done, onClickHide, }: NextStepProps) => void;
+export {};
+//# sourceMappingURL=helper.d.ts.map

package/dist/components/compositions/SteppedListCard/helper.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"helper.d.ts","sourceRoot":"","sources":["../../../../src/components/compositions/SteppedListCard/helper.ts"],"names":[],"mappings":"AAEA,KAAK,WAAW,GAAG;IACjB,WAAW,EAAE,MAAM,CAAA;IACnB,cAAc,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC,CAAA;IAC5D,aAAa,EAAE,MAAM,CAAA;IACrB,IAAI,EAAE,OAAO,EAAE,CAAA;IACf,OAAO,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,EAAE,CAAC,CAAC,CAAA;IACxD,SAAS,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAA;IACxD,WAAW,CAAC,EAAE,MAAM,IAAI,CAAA;CACzB,CAAA;AAED,eAAO,MAAM,IAAI,sCAQf,CAAA;AAEF,KAAK,aAAa,GAAG;IACnB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,YAAY,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,EAAE,CAAC,CAAC,CAAA;IAC7D,UAAU,EAAE,MAAM,CAAA;IAClB,cAAc,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC,CAAA;IAC5D,aAAa,EAAE,MAAM,CAAA;IACrB,SAAS,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAA;IACxD,IAAI,EAAE,OAAO,EAAE,CAAA;IACf,WAAW,CAAC,EAAE,MAAM,IAAI,CAAA;CACzB,CAAA;AAED;;;GAGG;AACH,eAAO,MAAM,QAAQ,gIAsBpB,CAAA"}

package/dist/components/compositions/SteppedListCard/helper.js

@@ -0,0 +1,33 @@
+import { __name } from "../../../_virtual/_rolldown/runtime.js";
+import { createContext } from "react";
+
+//#region src/components/compositions/SteppedListCard/helper.ts
+const Data = createContext({
+	currentStep: 1,
+	done: [
+		false,
+		false,
+		false,
+		false,
+		false
+	],
+	numberOfSteps: 1,
+	onClickHide: () => {},
+	setCurrentStep: () => {},
+	setDone: () => {},
+	setHidden: () => {}
+});
+/**
+* Go to next step with or without validation of the current step
+* Close the component for the last step
+*/
+const nextStep = ({ completed, setCompleted, stepNumber, setCurrentStep, numberOfSteps, setHidden, done, onClickHide }) => {
+	const newValue = completed === void 0 ? done[stepNumber - 1] : completed;
+	setCompleted(done.map((item, index) => index === stepNumber - 1 ? newValue : item));
+	if (numberOfSteps > stepNumber) setCurrentStep(stepNumber + 1);
+	else if (onClickHide) onClickHide();
+	else setHidden(true);
+};
+
+//#endregion
+export { Data, nextStep };

package/dist/components/compositions/SteppedListCard/index.d.ts

@@ -0,0 +1,65 @@
+import type { ReactNode } from 'react';
+type SteppedListContainerProps = {
+    /**
+     * Title of the section, introduces the feature.
+     */
+    header: ReactNode;
+    /**
+     * List of steps
+     */
+    steps: (string | {
+        title: string;
+        icon: ReactNode;
+    })[];
+    /**
+     * Define here the content of each step
+     */
+    children: ReactNode;
+    /**
+     * Function called when the component is closed. This function will overload the default behavior.
+     */
+    onClickHide?: () => void;
+} & ({
+    /**
+     * Show the toggle option
+     */
+    showToggleOption: false;
+    hideTooltipText?: never;
+    hideText?: never;
+    showText?: never;
+    showTooltipText?: never;
+} | {
+    /**
+     * Show the toggle option
+     */
+    showToggleOption?: true;
+    /**
+     * Text of the tooltip on the hide button
+     */
+    hideTooltipText?: string;
+    /**
+     * Text of the "hide" button
+     */
+    hideText?: string;
+    /**
+     * Text of the "show" button
+     */
+    showText?: string;
+    /**
+     * Text of tooltip on the "show" button
+     */
+    showTooltipText?: string;
+});
+declare function SteppedListCard({ header, showToggleOption, hideTooltipText, hideText, showText, showTooltipText, children, steps, onClickHide }: SteppedListContainerProps): import("react/jsx-runtime").JSX.Element;
+declare namespace SteppedListCard {
+    var Step: ({ subHeader, children, image, stepNumber, completed, style, }: {
+        subHeader?: ReactNode;
+        children: ((nextStep: (completed?: boolean | undefined) => void) => ReactNode) | ReactNode;
+        image?: ReactNode;
+        stepNumber: number;
+        completed?: boolean | undefined;
+        style?: import("react").CSSProperties | undefined;
+    }) => import("react/jsx-runtime").JSX.Element | null;
+}
+export { SteppedListCard };
+//# sourceMappingURL=index.d.ts.map

package/dist/components/compositions/SteppedListCard/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/compositions/SteppedListCard/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAiBtC,KAAK,yBAAyB,GAAG;IAC/B;;OAEG;IACH,MAAM,EAAE,SAAS,CAAA;IACjB;;OAEG;IACH,KAAK,EAAE,CAAC,MAAM,GAAG;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,SAAS,CAAA;KAAE,CAAC,EAAE,CAAA;IACtD;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAA;IACnB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,IAAI,CAAA;CACzB,GAAG,CACA;IACE;;OAEG;IACH,gBAAgB,EAAE,KAAK,CAAA;IACvB,eAAe,CAAC,EAAE,KAAK,CAAA;IACvB,QAAQ,CAAC,EAAE,KAAK,CAAA;IAChB,QAAQ,CAAC,EAAE,KAAK,CAAA;IAChB,eAAe,CAAC,EAAE,KAAK,CAAA;CACxB,GACD;IACE;;OAEG;IACH,gBAAgB,CAAC,EAAE,IAAI,CAAA;IACvB;;OAEG;IACH,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB;;OAEG;IACH,eAAe,CAAC,EAAE,MAAM,CAAA;CACzB,CACJ,CAAA;iCAMwB,EACvB,MAAM,EACN,gBAAuB,EACvB,eAAe,EACf,QAAiB,EACjB,QAAiB,EACjB,eAAe,EACf,QAAQ,EACR,KAAK,EACL,WAAW,EACZ,EAAE,yBAAyB;;;;;;;;;;;AAqG5B,OAAO,EAAE,eAAe,EAAE,CAAA"}

package/dist/components/compositions/SteppedListCard/index.js

@@ -0,0 +1,96 @@
+'use client';
+import { __name } from "../../../_virtual/_rolldown/runtime.js";
+import { Stack } from "../../Stack/index.js";
+import { Text } from "../../Text/index.js";
+import { Button } from "../../Button/index.js";
+import { Row } from "../../Row/index.js";
+import { Card } from "../../Card/index.js";
+import { StepList } from "../../StepList/index.js";
+import { Data } from "./helper.js";
+import { hideButton, steppedListCard, steppedListCardWrapper } from "./styles.css.js";
+import { SteppedList } from "./Step.js";
+import { SteppedListContent } from "./SteppedListContent.js";
+import { Children, useMemo, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/components/compositions/SteppedListCard/index.tsx
+/**
+* SteppedListCard is a component created for guiding users through steps in a structured and linear manner.
+* It can pass prop "nextStep" to its children.
+*/
+const SteppedListCard = ({ header, showToggleOption = true, hideTooltipText, hideText = "Hide", showText = "Show", showTooltipText, children, steps, onClickHide }) => {
+	const numberOfSteps = Children.count(children);
+	const [currentStep, setCurrentStep] = useState(1);
+	const [hidden, setHidden] = useState(false);
+	const [done, setDone] = useState(new Array(steps.length).fill(false));
+	const values = useMemo(() => ({
+		currentStep,
+		done,
+		numberOfSteps,
+		onClickHide,
+		setCurrentStep,
+		setDone,
+		setHidden
+	}), [
+		currentStep,
+		setCurrentStep,
+		numberOfSteps,
+		done,
+		setDone,
+		setHidden,
+		onClickHide
+	]);
+	const onClickHideButton = () => {
+		if (onClickHide) onClickHide();
+		else setHidden(!hidden);
+	};
+	return /* @__PURE__ */ jsx(Data.Provider, {
+		value: values,
+		children: /* @__PURE__ */ jsxs(Stack, {
+			gap: 2,
+			width: "100%",
+			children: [/* @__PURE__ */ jsxs(Stack, {
+				alignItems: "center",
+				direction: "row",
+				justifyContent: "space-between",
+				children: [typeof header === "string" ? /* @__PURE__ */ jsx(Text, {
+					as: "h3",
+					variant: "heading",
+					children: header
+				}) : header, showToggleOption ? /* @__PURE__ */ jsx(Button, {
+					className: hideButton,
+					onClick: onClickHideButton,
+					sentiment: "neutral",
+					size: "small",
+					tooltip: hidden ? showTooltipText : hideTooltipText,
+					variant: "ghost",
+					children: hidden ? showText : hideText
+				}) : null]
+			}), hidden ? null : /* @__PURE__ */ jsx(Card, {
+				className: steppedListCard,
+				children: /* @__PURE__ */ jsxs(Row, {
+					templateColumns: "1fr 3fr",
+					children: [/* @__PURE__ */ jsx(Stack, {
+						className: steppedListCardWrapper,
+						direction: "column",
+						gap: 4,
+						children: /* @__PURE__ */ jsx(StepList, { children: steps.map((step, index) => {
+							const stepTitle = typeof step === "string" ? step : step.title;
+							const stepIcon = typeof step === "string" ? void 0 : step.icon;
+							return /* @__PURE__ */ jsx(SteppedList, {
+								completed: done[index],
+								stepIcon,
+								stepNumber: index + 1,
+								stepTitle
+							}, stepTitle);
+						}) })
+					}), children]
+				})
+			})]
+		})
+	});
+};
+SteppedListCard.Step = SteppedListContent;
+
+//#endregion
+export { SteppedListCard };

package/dist/components/compositions/SteppedListCard/styles.css.d.ts

@@ -0,0 +1,9 @@
+export declare const steppedListCard: string;
+export declare const steppedListCardWrapper: string;
+export declare const steppedListCardContent: string;
+export declare const steppedListCardImage: string;
+export declare const steppedListCardSubHeader: string;
+export declare const steppedListCardStepTitle: string;
+export declare const steppedListCardStep: string;
+export declare const hideButton: string;
+//# sourceMappingURL=styles.css.d.ts.map

package/dist/components/compositions/SteppedListCard/styles.css.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.css.d.ts","sourceRoot":"","sources":["../../../../src/components/compositions/SteppedListCard/styles.css.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,eAAe,QAAwB,CAAA;AAEpD,eAAO,MAAM,sBAAsB,QAGjC,CAAA;AAEF,eAAO,MAAM,sBAAsB,QAIjC,CAAA;AAEF,eAAO,MAAM,oBAAoB,QAG/B,CAAA;AAEF,eAAO,MAAM,wBAAwB,QAEnC,CAAA;AAEF,eAAO,MAAM,wBAAwB,QAgBnC,CAAA;AAEF,eAAO,MAAM,mBAAmB,QAE9B,CAAA;AAEF,eAAO,MAAM,UAAU,QAErB,CAAA"}

package/dist/components/compositions/SteppedListCard/styles.css.js

@@ -0,0 +1,14 @@
+/* empty css                      */
+
+//#region src/components/compositions/SteppedListCard/styles.css.ts
+var steppedListCard = "uv_11c7zuq0";
+var steppedListCardWrapper = "uv_11c7zuq1";
+var steppedListCardContent = "uv_11c7zuq2";
+var steppedListCardImage = "uv_11c7zuq3";
+var steppedListCardSubHeader = "uv_11c7zuq4";
+var steppedListCardStepTitle = "uv_11c7zuq5";
+var steppedListCardStep = "uv_11c7zuq6";
+var hideButton = "uv_11c7zuq7";
+
+//#endregion
+export { hideButton, steppedListCard, steppedListCardContent, steppedListCardImage, steppedListCardStep, steppedListCardStepTitle, steppedListCardSubHeader, steppedListCardWrapper };

package/dist/components/compositions/index.d.ts

@@ -1,2 +1,6 @@
+export { OfferList } from './OfferList';
 export { OptionSelector } from './OptionSelector';
+export { OrderSummary } from './OrderSummary';
+export { Plans } from './Plans';
+export { SteppedListCard } from './SteppedListCard';
 //# sourceMappingURL=index.d.ts.map

package/dist/components/compositions/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/compositions/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/compositions/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAA;AACvC,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAA;AACjD,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAA;AAC7C,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA;AAC/B,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAA"}

package/dist/components/compositions/index.js

@@ -1,4 +1,7 @@
+import { OfferList } from "./OfferList/index.js";
 import { OptionSelector } from "./OptionSelector/index.js";
-export {
-  OptionSelector
-};
+import { OrderSummary } from "./OrderSummary/index.js";
+import { Plans } from "./Plans/index.js";
+import { SteppedListCard } from "./SteppedListCard/index.js";
+
+export { OfferList, OptionSelector, OrderSummary, Plans, SteppedListCard };

package/dist/helpers/isClientSide.js

@@ -1,4 +1,9 @@
-const isClientSide = !!(typeof window !== "undefined" && window?.document?.createElement);
-export {
-  isClientSide
-};
+//#region src/helpers/isClientSide.ts
+var _window;
+/**
+* Check if the code is running on the client side. This is useful for checking if the code is running in the browser and not in SSR.
+*/
+const isClientSide = !!(typeof window !== "undefined" && ((_window = window) === null || _window === void 0 || (_window = _window.document) === null || _window === void 0 ? void 0 : _window.createElement));
+
+//#endregion
+export { isClientSide };

package/dist/helpers/isJSON.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"isJSON.d.ts","sourceRoot":"","sources":["../../src/helpers/isJSON.ts"],"names":[],"mappings":"AAAA,QAAA,MAAM,YAAY,GAAI,KAAK,MAAM,KAAG,OAQnC,CAAA;AAED,eAAe,YAAY,CAAA"}
+{"version":3,"file":"isJSON.d.ts","sourceRoot":"","sources":["../../src/helpers/isJSON.ts"],"names":[],"mappings":"AAAA,QAAA,MAAM,YAAY,0BAQjB,CAAA;AAED,eAAe,YAAY,CAAA"}