@ultraviolet/plus 0.15.0 → 0.15.2

package/dist/components/index.d.ts

@@ -0,0 +1,9 @@
+export { ContentCard } from './ContentCard';
+export { ContentCardGroup } from './ContentCardGroup';
+export { CodeEditor } from './CodeEditor';
+export { EstimateCost, estimateCostDefaultLocales } from './EstimateCost';
+export { CustomerSatisfaction } from './CustomerSatisfaction';
+export { Conversation } from './Conversation';
+export { Navigation, NavigationProvider, useNavigation } from './Navigation';
+export { FAQ } from './FAQ';
+export { SteppedListContainer } from './SteppedListCard';

package/dist/index.d.ts

@@ -1,636 +1 @@
-import * as react from 'react';
-import { ReactNode, MouseEventHandler, ComponentProps, RefObject, Dispatch } from 'react';
-import * as _emotion_react_jsx_runtime from '@emotion/react/jsx-runtime';
-import { langs } from '@uiw/codemirror-extensions-langs';
-import CodeMirror from '@uiw/react-codemirror';
-import { Alert } from '@ultraviolet/ui';
-import * as _emotion_styled from '@emotion/styled';
-import * as _emotion_react from '@emotion/react';
-import { ProductIcon } from '@ultraviolet/icons';
-
-type ContentCardProps = {
-    direction?: 'row' | 'column';
-    /**
-     * The image to display at the top of the card (if direction is column) or to the left of the card (if direction is row).
-     * By default, the image will be cropped to fit the card.
-     */
-    image?: string;
-    /**
-     * The icon the second element of the card to be displayed after the image. We allow any ReactNode but recommend
-     * using `<ProductIcon>` from `@ultraviolet/icons`.
-     */
-    icon?: ReactNode;
-    subtitle?: string;
-    title: string;
-    description?: string;
-    children?: ReactNode;
-    /**
-     * The href to link the card to. If not provided, the card will not be clickable.
-     */
-    href?: HTMLAnchorElement['href'];
-    target?: HTMLAnchorElement['target'];
-    onClick?: MouseEventHandler<HTMLElement>;
-    loading?: boolean;
-    className?: string;
-};
-/**
- * ContentCard is a component that displays a title, subtitle, description, image and icon in a card.
- * It can take different directions to display the image and the content. You can also add more content
- * by passing children.
- */
-declare const ContentCard: react.ForwardRefExoticComponent<ContentCardProps & react.RefAttributes<HTMLAnchorElement & HTMLButtonElement & HTMLDivElement>>;
-
-type BaseContentCardGroupProps = {
-    children: ReactNode;
-    loading?: boolean;
-};
-declare const ContentCardGroup: react.ForwardRefExoticComponent<BaseContentCardGroupProps & react.RefAttributes<HTMLDivElement>> & {
-    Card: react.ForwardRefExoticComponent<{
-        title?: string | undefined;
-        subtitle?: string | undefined;
-        description?: string | undefined;
-        children?: ReactNode;
-        href: string;
-        target?: react.HTMLAttributeAnchorTarget | undefined;
-    } & react.RefAttributes<HTMLAnchorElement>>;
-};
-
-type CodeEditorProps = {
-    title?: string;
-    value: string;
-    onChange: ComponentProps<typeof CodeMirror>['onChange'];
-    extensions: keyof typeof langs;
-    onBlur?: () => void;
-    height?: string;
-    readOnly?: boolean;
-};
-declare const CodeEditor: ({ title, value, onChange, extensions, onBlur, height, readOnly, }: CodeEditorProps) => _emotion_react_jsx_runtime.JSX.Element;
-
-declare const _default$1: {
-    readonly 'estimate.cost.description': "This summary provides a cost estimation based on your configuration, the amount of time you expect to use the resource for, and the scale of your expected usage. For the purposes of this calculation, we consider that 1 month equals to 730 hours.";
-    readonly 'estimate.cost.label': "Estimated cost";
-    readonly 'estimate.cost.beta.free': "Free During Beta";
-    readonly 'estimate.cost.beta.discount': "% off during Beta";
-    readonly 'estimate.cost.beta.badge': "Beta Version";
-    readonly 'estimate.cost.units.seconds.label': "Second(s)";
-    readonly 'estimate.cost.units.minutes.label': "Minute(s)";
-    readonly 'estimate.cost.units.hours.label': "Hour(s)";
-    readonly 'estimate.cost.units.days.label': "Day(s)";
-    readonly 'estimate.cost.units.months.label': "Month(s)";
-    readonly 'estimate.cost.units.years.label': "Year(s)";
-    readonly 'estimate.cost.fees.oneTime.title': "One time fees";
-    readonly 'estimate.cost.fees.monthly.title': "Each month";
-    readonly 'estimate.cost.fees.commitment': "Commitment Fees";
-    readonly 'estimate.cost.units.gb.label': "GB";
-    readonly 'estimate.cost.notDefined': "Not defined";
-    readonly 'estimate.cost.submit.label': "Create";
-    readonly 'estimate.cost.region.label': "Region";
-    readonly 'estimate.cost.az.label': "Availability Zone";
-};
-
-type EstimateCostProps = {
-    /**
-     * Text to display into an alert on the top of the EstimateCost component.
-     */
-    alert?: ReactNode;
-    alertTitle?: string;
-    /**
-     * Type of the alert defined by the Scaleway UI Alert component.
-     */
-    alertVariant?: ComponentProps<typeof Alert>['sentiment'];
-    children: ReactNode;
-    /**
-     * Individual fees to display at the bottom of the EstimateCost component.
-     */
-    commitmentFees?: number;
-    /**
-     * Content to display into the fees part, it can be any component but in order to have a consistent design, it is recommended to use `<EstimateCost.Regular>` and `<EstimateCost.Strong>` components.
-     */
-    commitmentFeesContent?: ReactNode;
-    /**
-     * By default, a description exists but if you need you can customize it with this prop.
-     */
-    description?: ReactNode;
-    /**
-     * Hide the floating estimate cost overlay shown in the bottom of the page.
-     */
-    hideOverlay?: boolean;
-    /**
-     * Disable left button on the overlay.
-     */
-    disableOverlayLeft?: boolean;
-    /**
-     * Disable right button (submit) on the overlay.
-     */
-    disableOverlayRight?: boolean;
-    /**
-     * This is a global discount for all estimate cost, all sub items will be impacted by this discount.
-     * The discount is a percentage, so 0.1 means 10% discount. Discount = 1 means 100% so it means free.
-     * This is usually associate with beta products and prop `isBeta`.
-     */
-    discount?: number;
-    /**
-     * The default time unit to select.
-     */
-    defaultTimeUnit?: Units;
-    /**
-     * List of time unit the price can be calculated with. Can only be an array of `seconds`, `minutes`, `hours`, `days` or `months`.
-     */
-    timeUnits?: Units[];
-    /**
-     * Hide the selectable time unit on the top of the component.
-     */
-    hideTimeUnit?: boolean;
-    /**
-     * Hide the total price at the bottom of the component.
-     */
-    hideTotal?: boolean;
-    /**
-     * Hide the hourly price in total section at the bottom of the component.
-     */
-    hideHourlyPriceOnTotal?: boolean;
-    /**
-     * Show a badge beta on the total price with how much discount is applied.
-     */
-    isBeta?: boolean;
-    /**
-     * It will display another individual line at the bottom of the component with a monthly price. It can be used when you display hourly price, but you have one or many items that are billed monthly.
-     */
-    monthlyFees?: number;
-    /**
-     * Content to display into monthly fees part, it can be any component but in order to have a consistent design, it is recommended to use `<EstimateCost.Regular>` and `<EstimateCost.Strong>` components.
-     */
-    monthlyFeesContent?: ReactNode;
-    /**
-     * Label of the item, it describes what kind of fees is related to. (ex: "Installation fee")
-     */
-    monthlyFeesLabel?: string;
-    /**
-     * Content that will be shown on the left side of the overlay.
-     */
-    OverlayLeft?: (props: {
-        children: ReactNode;
-        disabled?: boolean;
-    }) => JSX.Element;
-    /**
-     * Content that will be shown on the left side of the overlay.
-     */
-    OverlayRight?: (props: {
-        children?: ReactNode;
-        disabled?: boolean;
-    }) => JSX.Element;
-    /**
-     * Time unit to use on the overlay. It can be different from estimate cost.
-     */
-    overlayUnit?: Units;
-    /**
-     * Locales for the component. By default, it will use the english locales.
-     */
-    locales?: typeof _default$1;
-    /**
-     * Defines the currency to be shown in the component.
-     * To find out all currencies checkout https://en.wikipedia.org/wiki/ISO_4217#List_of_ISO_4217_currency_codes section "Code" of the table.
-     */
-    currency?: string;
-    /**
-     * Defines the way we display numbers depending on locale (ex: 1,000.00 or 1 000,00).
-     * To understand better please read https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat/NumberFormat#locales
-     */
-    numberLocales?: string;
-    overlayMargin?: string;
-};
-type Units = 'seconds' | 'minutes' | 'hours' | 'days' | 'months';
-type Iteration = {
-    unit: Units;
-    value: number;
-};
-type BareEstimateProduct = {
-    id: string;
-};
-type EstimateProduct = BareEstimateProduct & {
-    amount: number;
-    price: number;
-    amountFree: number;
-    isVariant: boolean;
-    maxAmount: number;
-    noIteration: boolean;
-    longFractionDigits: boolean;
-    discount: number;
-};
-
-declare const EstimateCost: {
-    ({ description, alert, alertTitle, alertVariant, defaultTimeUnit, timeUnits, hideOverlay, disableOverlayLeft, disableOverlayRight, hideTimeUnit, hideTotal, discount, OverlayRight, OverlayLeft, overlayMargin, isBeta, commitmentFees, commitmentFeesContent, monthlyFees, monthlyFeesLabel, monthlyFeesContent, overlayUnit, children, locales, numberLocales, currency, }: EstimateCostProps): _emotion_react_jsx_runtime.JSX.Element;
-    LineThrough: _emotion_styled.StyledComponent<{
-        theme?: _emotion_react.Theme | undefined;
-        as?: react.ElementType<any, keyof react.JSX.IntrinsicElements> | undefined;
-    } & {
-        isActive?: boolean | undefined;
-    }, react.DetailedHTMLProps<react.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
-    Item: ({ discount, priceText, discountText, label, tooltipInfo, subLabel, price: basePrice, monthlyPrice, unit: baseUnit, amount: currentAmount, onAmountChange, amountFree, maxAmount, longFractionDigits, noIteration, noIterationText, noBorder, noPrice, isDefined, children, isFirstElement, isLastElement, isPrimaryBackground, productsCallback, iteration: receivedIteration, shouldBeHidden, hideFromOverlay, textNotDefined, animated, tabulation, labelTextVariant, labelTextProminence, notice, }: {
-        amount?: number | undefined;
-        amountFree?: number | undefined;
-        animated?: boolean | undefined;
-        children?: ReactNode;
-        discount?: number | undefined;
-        discountText?: string | undefined;
-        hideFromOverlay?: boolean | undefined;
-        isDefined?: boolean | undefined;
-        isFirstElement?: boolean | undefined;
-        isLastElement?: boolean | undefined;
-        isPrimaryBackground?: boolean | undefined;
-        iteration?: Iteration | undefined;
-        label?: ReactNode;
-        labelTextVariant?: "body" | "caption" | "code" | "heading" | "bodySmall" | "bodySmallStrong" | "bodySmallStronger" | "bodyStrong" | "bodyStronger" | "captionSmall" | "captionSmallStrong" | "captionSmallStronger" | "captionStrong" | "captionStronger" | "codeStrong" | "codeStronger" | "headingLarge" | "headingLargeStrong" | "headingLargeStronger" | "headingSmall" | "headingSmallStrong" | "headingSmallStronger" | "headingStrong" | "headingStronger" | undefined;
-        labelTextProminence?: "strong" | "weak" | "default" | "stronger" | undefined;
-        longFractionDigits?: boolean | undefined;
-        maxAmount?: number | undefined;
-        monthlyPrice?: number | undefined;
-        noBorder?: boolean | undefined;
-        noIteration?: boolean | undefined;
-        noIterationText?: string | undefined;
-        noPrice?: boolean | undefined;
-        notice?: string | undefined;
-        onAmountChange?: ((amount: number) => void) | undefined;
-        price?: number | undefined;
-        priceText?: ReactNode;
-        productsCallback?: {
-            add: (product: EstimateProduct) => void;
-            remove: (product: BareEstimateProduct) => void;
-        } | undefined;
-        shouldBeHidden?: boolean | undefined;
-        subLabel?: string | undefined;
-        tabulation?: number | undefined;
-        textNotDefined?: string | undefined;
-        tooltipInfo?: string | undefined;
-        unit?: (string & {}) | "seconds" | "minutes" | "hours" | "days" | "months" | "mb" | "gb" | "tb" | "years" | undefined;
-    }) => _emotion_react_jsx_runtime.JSX.Element;
-    NumberInput: ({ amount, minValue, maxValue, getAmountValue, itemCallback, }: {
-        amount?: number | undefined;
-        itemCallback?: ((amount?: number | null | undefined, isVariant?: boolean | undefined) => void) | undefined;
-        getAmountValue?: ((amount?: number | null | undefined) => void) | undefined;
-        minValue?: number | undefined;
-        maxValue?: number | undefined;
-    }) => _emotion_react_jsx_runtime.JSX.Element;
-    Unit: ({ amount, itemCallback, getAmountValue, unit, }: {
-        amount?: number | undefined;
-        itemCallback?: ((amount?: number | undefined, isVariant?: boolean | undefined) => void) | undefined;
-        getAmountValue?: ((amount?: number | undefined) => void) | undefined;
-        unit?: string | undefined;
-    }) => _emotion_react_jsx_runtime.JSX.Element;
-    Strong: ({ variant, children, isDisabledOnOverlay, }: {
-        variant?: "big" | "small" | "normal" | "capitalized" | undefined;
-        children?: ReactNode;
-        isDisabledOnOverlay?: boolean | undefined;
-    }) => _emotion_react_jsx_runtime.JSX.Element;
-    Regular: ({ variant, isDisabledOnOverlay, children, className, }: {
-        variant?: "big" | "small" | "normal" | "capitalized" | undefined;
-        isDisabledOnOverlay?: boolean | undefined;
-        children?: ReactNode;
-        className?: string | undefined;
-    }) => _emotion_react_jsx_runtime.JSX.Element | null;
-    Image: _emotion_styled.StyledComponent<{
-        theme?: _emotion_react.Theme | undefined;
-        as?: react.ElementType<any, keyof react.JSX.IntrinsicElements> | undefined;
-    }, react.DetailedHTMLProps<react.ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;
-    Region: ({ label, image, shouldBeHidden, priceText, animated, isFirstElement, isLastElement, productsCallback, iteration, discount, noBorder, noPrice, hideFromOverlay, }: {
-        shouldBeHidden?: boolean | undefined;
-        priceText?: ReactNode;
-        animated?: boolean | undefined;
-        isFirstElement?: boolean | undefined;
-        isLastElement?: boolean | undefined;
-        productsCallback?: {
-            add: (product: EstimateProduct) => void;
-            remove: (product: BareEstimateProduct) => void;
-        } | undefined;
-        iteration?: Iteration | undefined;
-        discount?: number | undefined;
-        label: string;
-        image: string;
-        noBorder?: boolean | undefined;
-        noPrice?: boolean | undefined;
-    } & Pick<{
-        amount?: number | undefined;
-        amountFree?: number | undefined;
-        animated?: boolean | undefined;
-        children?: ReactNode;
-        discount?: number | undefined;
-        discountText?: string | undefined;
-        hideFromOverlay?: boolean | undefined;
-        isDefined?: boolean | undefined;
-        isFirstElement?: boolean | undefined;
-        isLastElement?: boolean | undefined;
-        isPrimaryBackground?: boolean | undefined;
-        iteration?: Iteration | undefined;
-        label?: ReactNode;
-        labelTextVariant?: "body" | "caption" | "code" | "heading" | "bodySmall" | "bodySmallStrong" | "bodySmallStronger" | "bodyStrong" | "bodyStronger" | "captionSmall" | "captionSmallStrong" | "captionSmallStronger" | "captionStrong" | "captionStronger" | "codeStrong" | "codeStronger" | "headingLarge" | "headingLargeStrong" | "headingLargeStronger" | "headingSmall" | "headingSmallStrong" | "headingSmallStronger" | "headingStrong" | "headingStronger" | undefined;
-        labelTextProminence?: "strong" | "weak" | "default" | "stronger" | undefined;
-        longFractionDigits?: boolean | undefined;
-        maxAmount?: number | undefined;
-        monthlyPrice?: number | undefined;
-        noBorder?: boolean | undefined;
-        noIteration?: boolean | undefined;
-        noIterationText?: string | undefined;
-        noPrice?: boolean | undefined;
-        notice?: string | undefined;
-        onAmountChange?: ((amount: number) => void) | undefined;
-        price?: number | undefined;
-        priceText?: ReactNode;
-        productsCallback?: {
-            add: (product: EstimateProduct) => void;
-            remove: (product: BareEstimateProduct) => void;
-        } | undefined;
-        shouldBeHidden?: boolean | undefined;
-        subLabel?: string | undefined;
-        tabulation?: number | undefined;
-        textNotDefined?: string | undefined;
-        tooltipInfo?: string | undefined;
-        unit?: (string & {}) | "seconds" | "minutes" | "hours" | "days" | "months" | "mb" | "gb" | "tb" | "years" | undefined;
-    }, "hideFromOverlay">) => _emotion_react_jsx_runtime.JSX.Element;
-    Zone: ({ label, image, shouldBeHidden, priceText, animated, isFirstElement, isLastElement, productsCallback, iteration, discount, noBorder, noPrice, }: {
-        shouldBeHidden?: boolean | undefined;
-        priceText?: string | undefined;
-        animated?: boolean | undefined;
-        isFirstElement?: boolean | undefined;
-        isLastElement?: boolean | undefined;
-        productsCallback?: {
-            add: (product: EstimateProduct) => void;
-            remove: (product: BareEstimateProduct) => void;
-        } | undefined;
-        iteration?: Iteration | undefined;
-        discount?: number | undefined;
-        label: string;
-        image: string;
-        noBorder?: boolean | undefined;
-        noPrice?: boolean | undefined;
-    }) => _emotion_react_jsx_runtime.JSX.Element;
-    Ellipsis: ({ children, maxWidth, "data-testid": dataTestId, }: {
-        children: ReactNode;
-        maxWidth?: number;
-        'data-testid'?: string;
-    }) => _emotion_react_jsx_runtime.JSX.Element;
-};
-
-declare const ratings: readonly [{
-    readonly value: 1;
-    readonly imgSelected: string;
-    readonly imgNotSelected: string;
-}, {
-    readonly value: 2;
-    readonly imgSelected: string;
-    readonly imgNotSelected: string;
-}, {
-    readonly value: 3;
-    readonly imgSelected: string;
-    readonly imgNotSelected: string;
-}, {
-    readonly value: 4;
-    readonly imgSelected: string;
-    readonly imgNotSelected: string;
-}, {
-    readonly value: 5;
-    readonly imgSelected: string;
-    readonly imgNotSelected: string;
-}];
-type Value = (typeof ratings)[number]['value'];
-type CustomerSatisfactionProps = {
-    value: Value;
-    onChange: (rating: Value) => void;
-    'data-testid'?: string;
-    className?: string;
-};
-declare const CustomerSatisfaction: ({ value, onChange, "data-testid": dataTestId, className, }: CustomerSatisfactionProps) => _emotion_react_jsx_runtime.JSX.Element;
-
-declare const Conversation: {
-    ({ children }: {
-        children: ReactNode;
-    }): _emotion_react_jsx_runtime.JSX.Element;
-    Date: ({ children }: {
-        children: ReactNode;
-    }) => _emotion_react_jsx_runtime.JSX.Element;
-    Message: ({ className, children, avatar, align, }: MessageProps) => _emotion_react_jsx_runtime.JSX.Element;
-    MessageInfos: ({ children, align, }: {
-        children: ReactNode;
-        align: 'left' | 'right';
-    }) => _emotion_react_jsx_runtime.JSX.Element;
-    Tag: ({ children }: {
-        children: ReactNode;
-    }) => _emotion_react_jsx_runtime.JSX.Element;
-};
-type MessageProps = {
-    className?: string;
-    children: ReactNode;
-    avatar: ReactNode;
-    align?: 'left' | 'right';
-};
-
-type NavigationProps = {
-    children: ReactNode;
-    /**
-     * The logo to be displayed in header of the navigation
-     * It can be a component or a function. The function will retrun you
-     * expanded state of the navigation so you can decide to show/hide
-     * some part of your logo
-     */
-    logo?: ReactNode | ((expanded: boolean) => ReactNode);
-    /**
-     * This function is called when resize occur using the vertical bar on the left of the navigation.
-     */
-    onWidthResize?: (width: number) => void;
-    id?: string;
-    className?: string;
-};
-/**
- * Navigation is a component that allows you to create a sidebar navigation.
- * You can wrap your navigation items like `<Navigation.Item>` with your router
- * to make it work in your application.
- */
-declare const Navigation: {
-    ({ children, logo, onWidthResize, className, id, }: NavigationProps): _emotion_react_jsx_runtime.JSX.Element;
-    Group: ({ children, label }: {
-        children: ReactNode;
-        label: string; /**
-         * The logo to be displayed in header of the navigation
-         * It can be a component or a function. The function will retrun you
-         * expanded state of the navigation so you can decide to show/hide
-         * some part of your logo
-         */
-    }) => _emotion_react_jsx_runtime.JSX.Element | null;
-    Item: ({ children, categoryIcon, categoryIconVariant, label, subLabel, badgeText, badgeSentiment, href, onClick, toggle, active, noPinButton, type, hasParents, as, disabled, noExpand, index, id, }: {
-        children?: ReactNode;
-        categoryIcon?: "security" | "console" | "database" | "pin" | "billing" | "storage" | "baremetal" | "webHosting" | "vpc" | "useCase" | "toolsServices" | "serverless" | "observability" | "network" | "managedServices" | "iot" | "documentation" | "dedicatedServer" | "datacenter" | "containers" | "compute" | "ai" | "labs" | "devTools" | "applicationIntegration" | undefined;
-        categoryIconVariant?: "neutral" | "primary" | undefined;
-        label: string;
-        id: string;
-        subLabel?: string | undefined;
-        badgeText?: string | undefined;
-        badgeSentiment?: ("neutral" | "danger" | "info" | "primary" | "secondary" | "success" | "warning") | undefined;
-        href?: string | undefined;
-        onClick?: ((toggle?: boolean | undefined) => void) | undefined;
-        toggle?: boolean | undefined;
-        active?: boolean | undefined;
-        noPinButton?: boolean | undefined;
-        type?: ("default" | "pinned" | "pinnedGroup") | undefined;
-        hasParents?: boolean | undefined;
-        index?: number | undefined;
-        as?: keyof react.JSX.IntrinsicElements | undefined;
-        noExpand?: boolean | undefined;
-        disabled?: boolean | undefined;
-    }) => _emotion_react_jsx_runtime.JSX.Element | null;
-    PinnedItems: ({ toggle }: {
-        toggle?: boolean | undefined;
-    }) => _emotion_react_jsx_runtime.JSX.Element | null;
-    Separator: () => _emotion_react_jsx_runtime.JSX.Element;
-};
-
-declare const _default: {
-    readonly 'navigation.pin.tooltip': "Pin product";
-    readonly 'navigation.unpin.tooltip': "Unpin product";
-    readonly 'navigation.pin.limit': "You cannot pin more products";
-    readonly 'navigation.pinned.item.group.label': "Pinned items";
-    readonly 'navigation.expand.button': "Expand sidebar";
-    readonly 'navigation.collapse.button': "Collapse sidebar";
-    readonly 'navigation.pinned.item.group.empty': "You have no pinned items.";
-};
-
-type Item = {
-    label: string;
-    active?: boolean;
-    onClick?: (toggle?: true | false) => void;
-};
-type Items = Record<string, Item>;
-type ContextProps = {
-    expanded: boolean;
-    toggleExpand: (toggle?: boolean) => void;
-    animation: boolean | 'expand' | 'collapse';
-    pinnedFeature?: boolean;
-    onClickPinUnpin?: (pinned: string[]) => void;
-    pinItem: (item: string) => void;
-    unpinItem: (item: string) => void;
-    pinnedItems: string[];
-    pinLimit: number;
-    navigationRef: RefObject<HTMLDivElement>;
-    locales: typeof _default;
-    width: number;
-    setWidth: (width: number) => void;
-    /**
-     * This function will reorder the pinned items based on the initial index and
-     * the end index.
-     */
-    reorderItems: (
-    /**
-     * The initial index of the item
-     */
-    initialIndex: number, 
-    /**
-     * The end index of the item
-     */
-    endIndex: number) => void;
-    items: Items;
-    registerItem: Dispatch<Items>;
-};
-declare const useNavigation: () => ContextProps;
-type NavigationProviderProps = {
-    children: ReactNode;
-    initialWidth?: number;
-    /**
-     * This enable / disable the pinned feature of the navigation
-     * Pinned allows the use to pin (or favorite) some items in the navigation
-     */
-    pinnedFeature?: boolean;
-    /**
-     * This define how many items can be pinned at the same time.
-     * If you want to disable the limit just set `Infinity` to this prop
-     */
-    pinLimit?: number;
-    /**
-     * The initial pinned items. This should be an array of labels you've set on
-     * your `<Navigation.Item>`
-     */
-    initialPinned?: string[];
-    /**
-     * The initial expanded state of the navigation. If set to true the
-     * navigation will be expanded by default otherwise it will be collapsed
-     */
-    initialExpanded?: boolean;
-    locales?: typeof _default;
-    /**
-     * This function is triggered when user click on expand button on the footer
-     * of the navigation. This is not triggered when the user resize the navigation
-     * and it automatically collapse / expand.
-     */
-    onClickExpand?: (expanded: boolean) => void;
-    /**
-     * This function is triggered when the user click on the pin/unpin button
-     * of an item. To access all pinned item you can use the `useNavigation` hook
-     * and access the `pinnedItems` property.
-     */
-    onClickPinUnpin?: (
-    /**
-     * The state of the item after the click
-     */
-    state: 'pin' | 'unpin', 
-    /**
-     * The current items that has been pinned on click
-     */
-    pinned: string) => void;
-};
-declare const NavigationProvider: ({ children, pinnedFeature, initialPinned, initialExpanded, locales, pinLimit, onClickExpand, initialWidth, onClickPinUnpin, }: NavigationProviderProps) => _emotion_react_jsx_runtime.JSX.Element;
-
-type FAQProps = {
-    description: string;
-    productIconName?: ComponentProps<typeof ProductIcon>['name'];
-    illustrationText?: number | string;
-    notes?: string;
-    title: string;
-};
-declare const FAQ: ({ productIconName, illustrationText, title, description, notes, }: FAQProps) => _emotion_react_jsx_runtime.JSX.Element;
-
-type SteppedListContainerProps = {
-    /**
-     * Title of the section, introduces the feature.
-     */
-    header: ReactNode;
-    /**
-     * 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;
-    /**
-     * List of steps
-     */
-    steps: string[];
-    /**
-     * 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;
-};
-/**
- * SteppedListContainer is a component created for guiding users through steps in a structured and linear manner.
- * It can pass prop "nextStep" to its children.
- */
-declare const SteppedListContainer: {
-    ({ header, hideTooltipText, hideText, showText, showTooltipText, children, steps, onClickHide, }: SteppedListContainerProps): _emotion_react_jsx_runtime.JSX.Element;
-    Step: ({ subHeader, children, image, stepNumber, }: {
-        subHeader?: ReactNode;
-        children: ReactNode | ((nextStep: (completed: boolean) => void) => ReactNode);
-        image?: ReactNode;
-        stepNumber: number;
-    }) => _emotion_react_jsx_runtime.JSX.Element;
-};
-
-export { CodeEditor, ContentCard, ContentCardGroup, Conversation, CustomerSatisfaction, EstimateCost, FAQ, Navigation, NavigationProvider, SteppedListContainer, _default$1 as estimateCostDefaultLocales, useNavigation };
+export * from './components';

package/dist/index.js

@@ -0,0 +1,25 @@
+import { ContentCard } from "./components/ContentCard/index.js";
+import { ContentCardGroup } from "./components/ContentCardGroup/index.js";
+import { CodeEditor } from "./components/CodeEditor/CodeEditor.js";
+import { EstimateCost } from "./components/EstimateCost/EstimateCost.js";
+import { default as default2 } from "./components/EstimateCost/locales/en.js";
+import { CustomerSatisfaction } from "./components/CustomerSatisfaction/index.js";
+import { Conversation } from "./components/Conversation/index.js";
+import { Navigation } from "./components/Navigation/Navigation.js";
+import { NavigationProvider, useNavigation } from "./components/Navigation/NavigationProvider.js";
+import { FAQ } from "./components/FAQ/index.js";
+import { SteppedListContainer } from "./components/SteppedListCard/SteppedListContainer.js";
+export {
+  CodeEditor,
+  ContentCard,
+  ContentCardGroup,
+  Conversation,
+  CustomerSatisfaction,
+  EstimateCost,
+  FAQ,
+  Navigation,
+  NavigationProvider,
+  SteppedListContainer,
+  default2 as estimateCostDefaultLocales,
+  useNavigation
+};