bonprix-design-system 0.33.2

package/dist/index.d.ts

@@ -0,0 +1,835 @@
+import { default as default_2 } from 'react';
+import { ElementType } from 'react';
+import { FC } from 'react';
+import { HTMLInputAutoCompleteAttribute } from 'react';
+import { Options } from '@splidejs/react-splide';
+import { ReactNode } from 'react';
+import { RefObject } from 'react';
+import { SplideSlide } from '@splidejs/react-splide';
+import { default as tailwindConfig } from '../tailwind.config';
+
+export declare const Accordion: FC<AccordionProps> & Subcomponents;
+
+export declare interface AccordionProps {
+    children: default_2.ReactNode;
+}
+
+export declare const Alert: FC<AlertProps>;
+
+export declare interface AlertProps {
+    isOpen: boolean;
+    variant?: `${VariantValues}`;
+    severity: `${SeverityLevels}`;
+    title?: string;
+    children: string;
+    showCloseIcon?: boolean;
+    onClose?: () => void;
+}
+
+declare interface AsButton extends BaseProps_2 {
+    link?: false;
+    disabled?: boolean;
+    loading?: boolean;
+}
+
+declare interface AsButton_2 extends BaseProps_3 {
+    button: true;
+    onClick: () => void;
+}
+
+declare interface AsLink extends BaseProps_2 {
+    link: true;
+    href: string;
+    rel?: string;
+    target?: "_blank" | "_self" | "_parent" | "_top";
+}
+
+declare interface AsLink_2 extends BaseProps_3 {
+    button?: false;
+    onClick?: () => void;
+    rel?: string;
+    href: string;
+    target?: "_blank" | "_self" | "_parent" | "_top";
+}
+
+export declare const Availability: FC<AvailabilityProps>;
+
+declare type Availability_2 = ImageAvailability | "currently-out-of-stock";
+
+export declare interface AvailabilityProps {
+    delivery: "available" | "available-soon" | "sold-out";
+    children: string;
+    almostSoldOut?: boolean;
+}
+
+declare interface BaseProps {
+    title: string;
+    children: ReactNode;
+    disabled?: boolean;
+    initiallyOpened?: boolean;
+    onOpen?: () => void;
+    onClose?: () => void;
+    onInitialInView?: () => void;
+    rootRef?: RefObject<HTMLDivElement>;
+}
+
+declare interface BaseProps_2 {
+    children: string;
+    icon?: Icon_2;
+    iconPosition?: "start" | "end";
+    contentWidth?: boolean;
+    loading?: boolean;
+    id?: string;
+    disabled?: boolean;
+    variant?: "primary" | "secondary" | "tertiary";
+}
+
+declare interface BaseProps_3 {
+    href: string;
+    children: string;
+    target?: "_blank" | "_self" | "_parent" | "_top";
+    showArrow?: boolean;
+    arrowPosition?: "left" | "right";
+    rel?: string;
+    small?: boolean;
+    hideUnderline?: boolean;
+}
+
+declare interface BaseProps_4 {
+    value: string;
+    label: string;
+    children: ReactNode;
+}
+
+declare interface BaseProps_5 {
+    children: string;
+    value?: string;
+}
+
+export declare const BenefitTag: FC<BenefitTagProps>;
+
+export declare interface BenefitTagProps {
+    children: string;
+    variant?: "product" | "price";
+    size?: "large" | "small";
+}
+
+export declare const BottomSheet: FC<BottomSheetProps>;
+
+export declare interface BottomSheetProps {
+    children: default_2.ReactNode;
+    isOpen: boolean;
+    onClose?: () => void;
+    modal?: boolean;
+    snapPoints?: number[];
+    initialSnap?: number;
+    autoClose?: boolean | number;
+    disableScrollbar?: boolean;
+    onSnap?: (snapPointIndex: number) => void;
+    zIndex?: number;
+}
+
+export declare const Breadcrumb: FC<BreadcrumbProps>;
+
+export declare interface BreadcrumbProps {
+    currentPageTitle: string;
+    previousPageTitle: string;
+    previousPageUrl: string;
+    hideHeader?: boolean;
+    numberOfItemsText?: string;
+}
+
+declare type Breakpoint = "s" | "m" | "l" | "xl" | "xxl" | "xxxl";
+
+declare interface Breakpoints {
+    s: number;
+    m: number;
+    l: number;
+    xl: number;
+    xxl: number;
+    xxxl: number;
+}
+
+export declare const breakpoints: Breakpoints;
+
+export declare const Button: FC<ButtonProps>;
+
+export declare type ButtonProps = SubmitResetVariantProps | ButtonVariantProps;
+
+declare type ButtonTypeAttribute = "button" | "submit" | "reset";
+
+declare type ButtonVariantProps = FinalBaseProps & {
+    onClick: () => void;
+    type?: "button";
+};
+
+export declare const Carousel: FC<CarouselProps> & Subcomponents_2;
+
+export declare interface CarouselProps {
+    children: default_2.ReactNode;
+    label: string;
+    perPage?: number;
+    perMove?: number;
+    rewind?: boolean;
+    focus?: number | "center";
+    gap?: number;
+    arrows?: boolean;
+    pagination?: boolean;
+    onMove?: (destIndex: number, prevIndex: number) => void;
+    padding?: Options["padding"];
+}
+
+export declare const Checkbox: FC<CheckboxProps>;
+
+export declare const CheckboxGroup: FC<CheckboxGroupProps> & Subcomponents_3;
+
+declare interface CheckboxGroupItemPropsExternal extends Omit<Props, "onChange" | "rootRef" | "name" | "checked"> {
+    name?: string;
+}
+
+export declare interface CheckboxGroupProps extends Props_2 {
+    label: string;
+    values: string[];
+    onChange: (value: string[]) => void;
+}
+
+export declare interface CheckboxProps extends Props {
+    helperText?: string;
+    errorText?: string;
+}
+
+export declare const Collapsible: FC<CollapsibleProps>;
+
+export declare type CollapsibleProps = DefaultProps | RateProps | SustainableProps;
+
+declare type ColumnSpan = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;
+
+export declare const Container: FC<ContainerProps>;
+
+export declare interface ContainerProps {
+    children: ReactNode;
+    disableFullScreen?: boolean;
+}
+
+declare const Content: FC<{
+    children: ReactNode;
+}>;
+
+declare const Content_2: FC<{
+    children: default_2.ReactNode;
+}>;
+
+declare interface DefaultProps extends BaseProps {
+    type?: "default";
+}
+
+export declare const Dialog: FC<DialogProps> & Subcomponents_4;
+
+export declare interface DialogProps {
+    isOpen: boolean;
+    children: ReactNode;
+    onClose: () => void;
+    zIndex?: number;
+}
+
+declare type FinalBaseProps = AsLink | AsButton;
+
+export declare const Grid: FC<GridProps> & {
+    Item: typeof GridItem;
+};
+
+declare const GridItem: FC<GridItemProps>;
+
+declare interface GridItemProps {
+    children?: ReactNode;
+    span?: ColumnSpan;
+    s?: ColumnSpan;
+    m?: ColumnSpan;
+    l?: ColumnSpan;
+    xl?: ColumnSpan;
+    xxl?: ColumnSpan;
+    xxxl?: ColumnSpan;
+}
+
+export declare interface GridProps {
+    children: ReactNode;
+    disableGutters?: boolean;
+}
+
+declare interface HTMLInputAttributes {
+    inputMode?: HTMLInputInputModeAttribute;
+    pattern?: HTMLInputPatternAttribute;
+    autoComplete?: HTMLInputAutoCompleteAttribute;
+    autoCorrect?: HTMLInputAutoCorrectAttribute;
+    spellCheck?: HTMLInputSpellCheckAttribute;
+    onKeyDown?: () => void;
+    onKeyUp?: () => void;
+}
+
+declare type HTMLInputAutoCorrectAttribute = "on" | "off";
+
+declare type HTMLInputInputModeAttribute = "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search";
+
+declare type HTMLInputPatternAttribute = HTMLInputElement["pattern"];
+
+declare type HTMLInputSpellCheckAttribute = HTMLInputElement["spellcheck"];
+
+export declare const Icon: FC<IconProps>;
+
+declare type Icon_2 = typeof iconNames[number];
+
+export declare const IconButton: FC<IconButtonProps>;
+
+export declare interface IconButtonProps {
+    icon: Icon_2;
+    label: string;
+    onClick: () => void;
+    loading?: boolean;
+    type?: ButtonTypeAttribute;
+    id?: string;
+    small?: boolean;
+    disabled?: boolean;
+    variant?: "primary" | "secondary" | "tertiary";
+}
+
+declare const iconNames: readonly ["account-balanced", "address-book", "alarm-clock", "alert", "app", "apple", "armchair", "arrow-down", "arrow-left", "arrow-right", "arrow-up", "back", "bell", "bra", "briefcase", "cake-piece-full", "cake-piece", "calendar", "cart", "catalog", "chat", "check-bold", "check", "child", "closer", "clothing", "clothing-size", "communication", "connection", "control-panel", "cookie", "copy", "credit-card", "crown", "culture", "customer", "delivery", "denied", "desktop", "diamond", "discount", "dots", "download", "edit", "education", "email", "error", "family", "faq", "fast-delivery", "feedback-negative", "feedback-positive", "first-aid", "fitness", "fossil-fuel", "free-delivery", "friendship", "global-warming", "glossary", "handshake", "hanger", "hashtag", "health", "heart-eyes-emoji", "heart-full", "heart", "help", "hint", "home", "home2", "image-placeholder", "info", "invoice", "light-bulb-heart", "light-bulb", "lightning", "location", "locations", "lock", "lock-open", "logged-in", "logout", "mail", "menu", "minus", "newsletter", "not-yet-available", "order", "order2", "out-of-stock", "personal-data", "phone", "pin", "pinch-zoom", "plane", "plus", "prepaid", "print", "process", "production-site", "puzzle", "qr-code", "quality", "question", "radio", "recently-viewed", "recycling", "religion", "return", "review-full", "review", "rocket", "roots", "scale", "search-categories", "search-form-arrow", "search", "sepa", "service", "share", "shopping-bag", "signpost", "signpost-single", "similar-products", "size", "social", "sold-out", "sort", "spark", "store", "success", "suitcase", "sustainable-animal-welfare", "sustainable-energy-efficient", "sustainable-natural-cosmetics", "sustainable-organic-materials", "sustainable-production", "sustainable-recyclable-design", "sustainable-recycling", "sustainable-resource", "sustainable-social-initiatives", "swords", "tablet", "teacup", "thumb-down", "thumb-up", "trash-bin", "tv", "user", "visibility", "visibility-off", "wallet", "water-pollution", "water-usage", "whatsapp-bell", "whatsapp-phone"];
+
+export declare interface IconProps {
+    variant: Icon_2;
+    className?: string;
+}
+
+declare const Image_2: FC<ImageProps>;
+export { Image_2 as Image }
+
+declare type ImageAvailability = "available" | "out-of-stock";
+
+export declare interface ImageProps {
+    srcSet: SourceSetMapper;
+    defaultSrc: string;
+    width: number;
+    height: number;
+    alt: string;
+    title?: string;
+}
+
+declare interface ImageVariantProps extends BaseProps_4 {
+    variant: "image";
+    imageWidth: number;
+    imageHeight: number;
+    onChange: (value: string, availability: ImageAvailability) => void;
+}
+
+declare interface ImageVariantProps_2 extends BaseProps_5, Omit<ImageProps, "width" | "height"> {
+    availability?: ImageAvailability;
+}
+
+export declare const Link: FC<LinkProps>;
+
+export declare type LinkProps = AsButton_2 | AsLink_2;
+
+export declare const List: FC<ListProps> & Subcomponents_5;
+
+declare const ListItem: FC<Props_5>;
+
+export declare interface ListProps {
+    children: ReactNode;
+    type?: "text" | "button" | "link";
+    showArrows?: boolean;
+    className?: string;
+}
+
+export declare const Logo: FC<LogoProps>;
+
+declare type Logo_2 = typeof logoNames[number];
+
+declare const logoNames: readonly ["app-apple-cz", "app-apple-de", "app-apple-en", "app-apple-es", "app-apple-fi", "app-apple-fr", "app-apple-hu", "app-apple-it", "app-apple-nl", "app-apple-no", "app-apple-ro", "app-apple-se", "app-apple-si", "app-google-play-cz", "app-google-play-de", "app-google-play-en", "app-google-play-es", "app-google-play-fi", "app-google-play-fr", "app-google-play-hu", "app-google-play-it", "app-google-play-nl", "app-google-play-no", "app-google-play-ro", "app-google-play-se", "app-google-play-si", "badge-save-shopping", "badge-shop-award", "bonprix-negative", "bonprix-positive", "payment-american-express", "payment-american-express-nrm", "payment-bancontact-colored", "payment-bancontact-colored-nrm", "payment-bancontact-mono", "payment-bancontact-mono-nrm", "payment-cb-colored", "payment-cb-colored-nrm", "payment-cb-mono", "payment-cb-mono-nrm", "payment-diners-club", "payment-diners-club-nrm", "payment-discover", "payment-discover-nrm", "payment-giropay-colored", "payment-giropay-colored-nrm", "payment-giropay-mono", "payment-giropay-mono-nrm", "payment-ideal-colored", "payment-ideal-colored-nrm", "payment-ideal-mono", "payment-ideal-mono-nrm", "payment-instalment", "payment-instalment-nrm", "payment-invoice", "payment-invoice-nrm", "payment-klarna-colored", "payment-klarna-colored-nrm", "payment-klarna-mono", "payment-klarna-mono-nrm", "payment-mastercard", "payment-mastercard-nrm", "payment-part-payment", "payment-part-payment-nrm", "payment-paypal", "payment-paypal-nrm", "payment-prepayment", "payment-prepayment-nrm", "payment-sepa", "payment-sepa-nrm", "payment-visa", "payment-visa-nrm", "product-fit-finder", "product-green-button", "product-higg-index", "product-sustainable", "social-facebook-colored", "social-facebook-mono", "social-instagram-colored", "social-instagram-mono", "social-pinterest-colored", "social-pinterest-mono", "social-tiktok-colored", "social-tiktok-mono", "social-whatsapp-colored", "social-whatsapp-mono", "social-x", "social-youtube-colored", "social-youtube-mono"];
+
+export declare interface LogoProps {
+    variant: Logo_2;
+    className?: string;
+}
+
+export declare const Modal: FC<ModalProps>;
+
+export declare interface ModalProps {
+    isOpen: boolean;
+    children?: default_2.ReactNode;
+    onClose?: () => void;
+    zIndex?: number;
+}
+
+export declare const Pagination: FC<PaginationProps>;
+
+declare type PaginationEventOrigin = "page" | "prev" | "next";
+
+export declare interface PaginationProps {
+    currentPage: number;
+    totalPages: number;
+    onPageChange: (newPage: number, origin: PaginationEventOrigin) => void;
+    baseHref: string;
+}
+
+export declare const PasswordField: FC<PasswordFieldProps>;
+
+export declare interface PasswordFieldProps extends HTMLInputAttributes {
+    value: string;
+    onChange: (value: string) => void;
+    onFocus?: () => void;
+    onBlur?: () => void;
+    inputRef?: RefObject<HTMLInputElement>;
+    label?: string;
+    name?: string;
+    id?: string;
+    helperText?: string;
+    errorText?: string;
+    disabled?: boolean;
+    required?: boolean;
+    error?: boolean;
+    describedBy?: string;
+}
+
+declare const PrimaryButton: FC<Props_3>;
+
+declare interface Props {
+    label: string;
+    name: string;
+    checked: boolean;
+    onChange: (checked: boolean) => void;
+    id?: string;
+    value?: string;
+    required?: boolean;
+    disabled?: boolean;
+    error?: boolean;
+    rootRef?: RefObject<HTMLButtonElement>;
+}
+
+declare interface Props_10 {
+    label: string;
+    subLabel?: string;
+    onClick?: () => void;
+    icon?: ReactNode;
+}
+
+declare interface Props_2 {
+    children: default_2.ReactNode;
+    label: string;
+    name?: string;
+    error?: boolean;
+    errorText?: string;
+    disabled?: boolean;
+    helperText?: string;
+    required?: boolean;
+}
+
+declare interface Props_3 {
+    children: default_2.ReactElement<ButtonProps>;
+}
+
+declare interface Props_4 {
+    children: default_2.ReactElement<ButtonProps>;
+}
+
+declare interface Props_5 {
+    children: string;
+    icon?: Icon_2;
+    onClick?: () => void;
+    href?: string;
+    target?: "_blank" | "_self" | "_parent" | "_top";
+}
+
+declare interface Props_6 {
+    value: string;
+    label: string;
+}
+
+declare interface Props_7 {
+    value: string;
+    children?: string;
+    disabled?: boolean;
+    hidden?: boolean;
+}
+
+declare type Props_8 = ImageVariantProps_2 | TextVariantProps_2;
+
+declare interface Props_9 {
+    children: string;
+    href?: string;
+}
+
+export declare const RadioGroup: FC<RadioGroupProps> & Subcomponents_6;
+
+declare const RadioGroupItem: FC<Props_6>;
+
+export declare interface RadioGroupProps extends Omit<Props_2, "error" | "errorText"> {
+    value: string;
+    onChange: (value: string) => void;
+}
+
+declare interface RateProps extends BaseProps {
+    type?: "rating";
+    rating: number;
+    ratingQuantity: number;
+}
+
+export declare const Rating: FC<RatingProps>;
+
+export declare interface RatingProps {
+    rating: number;
+    size?: "small" | "large";
+}
+
+export declare const RemovedItemPlaceholder: FC<RemovedItemPlaceholderProps>;
+
+export declare interface RemovedItemPlaceholderProps {
+    children: string;
+    actionLabel: string;
+    onClick: () => void;
+}
+
+export declare const ScrollArea: FC<ScrollAreaProps>;
+
+export declare interface ScrollAreaProps {
+    children: default_2.ReactNode | default_2.ReactElement | default_2.ReactElement[];
+    classes?: string;
+    disabled?: boolean;
+    verticalOnly?: boolean;
+}
+
+export declare const SearchField: FC<SearchFieldProps>;
+
+export declare interface SearchFieldProps extends HTMLInputAttributes {
+    value: string;
+    onChange: (value: string) => void;
+    onSearch: () => void;
+    onFocus?: () => void;
+    onBlur?: () => void;
+    inputRef?: RefObject<HTMLInputElement>;
+    label?: string;
+    name?: string;
+    id?: string;
+    helperText?: string;
+    errorText?: string;
+    disabled?: boolean;
+    required?: boolean;
+    error?: boolean;
+    describedBy?: string;
+    hideClear?: boolean;
+}
+
+declare const SecondaryButton: FC<Props_4>;
+
+export declare const Select: FC<SelectProps> & Subcomponents_7;
+
+declare const Selection_2: FC<SelectionProps> & Subcomponents_8;
+export { Selection_2 as Selection }
+
+declare const SelectionItem: FC<Props_8>;
+
+export declare type SelectionProps = ImageVariantProps | TextVariantProps;
+
+declare const SelectItem: FC<Props_7>;
+
+export declare interface SelectProps {
+    label: string;
+    value: string;
+    onValueChange: (value: string) => void;
+    children: default_2.ReactNode;
+    name?: string;
+    disabled?: boolean;
+    error?: boolean;
+    required?: boolean;
+    helperText?: string;
+    errorText?: string;
+}
+
+declare enum SeverityLevels {
+    SUCCESS = "success",
+    INFO = "info",
+    WARNING = "warning",
+    ERROR = "error"
+}
+
+export declare const SideSheet: FC<SideSheetProps> & Subcomponents_9;
+
+export declare interface SideSheetProps {
+    children: default_2.ReactNode;
+    isOpen: boolean;
+    modal?: boolean;
+    onClose?: () => void;
+    onBack?: () => void;
+    zIndex?: number;
+}
+
+declare interface SourceSetMapper {
+    s?: string;
+    m?: string;
+    l?: string;
+    xl?: string;
+    xxl?: string;
+    xxxl?: string;
+}
+
+export declare const Spinner: FC<SpinnerProps>;
+
+declare interface SpinnerProps {
+    edgeLength?: string;
+}
+
+export declare const StepNavi: FC<StepNaviProps> & Subcomponents_10;
+
+export declare interface StepNaviProps {
+    children: default_2.ReactNode;
+    completedSteps?: number;
+    activeStep?: number;
+    ariaLabel?: string;
+}
+
+declare const StepNaviStep: FC<Props_9>;
+
+declare interface Subcomponents {
+    Item: typeof Collapsible;
+}
+
+declare interface Subcomponents_10 {
+    Step: typeof StepNaviStep;
+}
+
+declare interface Subcomponents_11 {
+    Item: typeof TabItem;
+}
+
+declare interface Subcomponents_2 {
+    Slide: typeof SplideSlide;
+}
+
+declare interface Subcomponents_3 {
+    Item: FC<CheckboxGroupItemPropsExternal>;
+}
+
+declare interface Subcomponents_4 {
+    Title: typeof Title;
+    Content: typeof Content;
+    PrimaryButton: typeof PrimaryButton;
+    SecondaryButton: typeof SecondaryButton;
+}
+
+declare interface Subcomponents_5 {
+    Item: typeof ListItem;
+}
+
+declare interface Subcomponents_6 {
+    Item: typeof RadioGroupItem;
+}
+
+declare interface Subcomponents_7 {
+    Item: typeof SelectItem;
+}
+
+declare interface Subcomponents_8 {
+    Item: typeof SelectionItem;
+}
+
+declare interface Subcomponents_9 {
+    Title: typeof Title_2;
+    Content: typeof Content_2;
+    PrimaryButton: typeof PrimaryButton;
+    SecondaryButton: typeof SecondaryButton;
+}
+
+declare type SubmitResetVariantProps = FinalBaseProps & {
+    onClick?: () => void;
+    type?: "submit" | "reset";
+};
+
+declare type SustainableFeature = "animal-welfare" | "organic-materials" | "production" | "recyclable-design" | "recycling" | "resource" | "social-initiatives";
+
+declare interface SustainableProps extends BaseProps {
+    type?: "sustainable";
+    features: SustainableFeature[];
+}
+
+declare const TabItem: default_2.FC<Props_10>;
+
+export declare const Tabs: default_2.FC<TabsProps> & Subcomponents_11;
+
+export declare interface TabsProps {
+    children: ReactNode;
+    activeTab?: number;
+}
+
+export { tailwindConfig }
+
+export declare const TertiaryButton: FC<TertiaryButtonProps>;
+
+export declare interface TertiaryButtonProps {
+    children: string;
+    icon: Icon_2;
+    iconPosition?: "start" | "end";
+    contentWidth?: boolean;
+    disabled?: boolean;
+    small?: boolean;
+    onClick: () => void;
+    loading?: boolean;
+    type?: ButtonTypeAttribute;
+}
+
+export declare const Textarea: FC<TextareaProps>;
+
+export declare interface TextareaProps {
+    onChange: (value: string) => void;
+    value?: string;
+    label?: string;
+    placeholder?: string;
+    name?: string;
+    id?: string;
+    helperText?: string;
+    errorText?: string;
+    disabled?: boolean;
+    required?: boolean;
+    error?: boolean;
+    maxLength?: number;
+}
+
+export declare const TextField: FC<TextFieldProps>;
+
+export declare interface TextFieldProps extends HTMLInputAttributes {
+    value: string;
+    onChange: (value: string) => void;
+    onFocus?: () => void;
+    onBlur?: () => void;
+    label?: string;
+    name?: string;
+    id?: string;
+    helperText?: string;
+    errorText?: string;
+    disabled?: boolean;
+    required?: boolean;
+    error?: boolean;
+    type?: "text" | "email";
+    hideClear?: boolean;
+    mask?: string;
+    unmask?: boolean;
+    describedBy?: string;
+}
+
+declare interface TextVariantProps extends BaseProps_4 {
+    variant: "text";
+    placeholder: string;
+    onChange: (value: string, availability: Availability_2) => void;
+}
+
+declare interface TextVariantProps_2 extends BaseProps_5 {
+    availability?: Availability_2;
+}
+
+declare const Title: FC<{
+    children: string;
+}>;
+
+declare const Title_2: FC<{
+    children: string;
+}>;
+
+export declare const ToggleIcon: FC<ToggleIconProps>;
+
+export declare interface ToggleIconProps {
+    iconA: Icon_2;
+    iconB: Icon_2;
+    showIconA: boolean;
+    variant?: TransitionVariant;
+}
+
+export declare const Tooltip: FC<TooltipProps>;
+
+export declare interface TooltipProps {
+    children: ReactNode;
+    content: ReactNode;
+    zIndex?: number;
+}
+
+declare type TransitionVariant = keyof typeof TransitionVariants;
+
+declare enum TransitionVariants {
+    fade = "fade"
+}
+
+export declare const Typography: FC<TypographyProps>;
+
+declare type TypographyColor = keyof typeof TypographyColors;
+
+declare enum TypographyColors {
+    primary = "primary",
+    "on-primary-high" = "on-primary-high",
+    "on-primary-low" = "on-primary-low",
+    "on-bg-high" = "on-bg-high",
+    "on-bg-mid" = "on-bg-mid",
+    "on-bg-low" = "on-bg-low",
+    "on-bg-disabled" = "on-bg-disabled",
+    error = "error",
+    alert = "alert",
+    success = "success",
+    info = "info",
+    sale = "sale",
+    sustainable = "sustainable",
+    black = "black",
+    white = "white",
+    inherit = "inherit"
+}
+
+export declare interface TypographyProps {
+    children: ReactNode;
+    variant?: TypographyVariant;
+    component?: ElementType;
+    bold?: boolean;
+    strikeThrough?: boolean;
+    color?: TypographyColor;
+}
+
+declare type TypographyVariant = keyof typeof TypographyVariants;
+
+declare enum TypographyVariants {
+    h1 = "h1",
+    h2 = "h2",
+    h3 = "h3",
+    h4 = "h4",
+    h5 = "h5",
+    h6 = "h6",
+    "bonprix-h1" = "bonprix-h1",
+    "bonprix-h2" = "bonprix-h2",
+    "bonprix-h3" = "bonprix-h3",
+    "bonprix-h4" = "bonprix-h4",
+    "bonprix-h5" = "bonprix-h5",
+    "bonprix-h6" = "bonprix-h6",
+    body1 = "body1",
+    "body1-bold" = "body1-bold",
+    body2 = "body2",
+    "body2-bold" = "body2-bold",
+    subtitle1 = "subtitle1",
+    subtitle2 = "subtitle2",
+    caption = "caption",
+    overline = "overline"
+}
+
+export declare const useBreakpointBetween: (bp1: Breakpoint, bp2: Breakpoint) => boolean;
+
+export declare const useBreakpointCurrent: () => Breakpoint | undefined;
+
+export declare const useBreakpointDown: (bp: Breakpoint) => boolean;
+
+export declare const useBreakpointUp: (bp: Breakpoint) => boolean;
+
+export declare const useExperimentalBreakpointBetween: (bp1: Breakpoint, bp2: Breakpoint) => boolean | undefined;
+
+export declare const useExperimentalBreakpointCurrent: () => Breakpoint | undefined;
+
+export declare const useExperimentalBreakpointDown: (bp: Breakpoint) => boolean | undefined;
+
+export declare const useExperimentalBreakpointUp: (bp: Breakpoint) => boolean;
+
+declare enum VariantValues {
+    PRIMARY = "primary",
+    SECONDARY = "secondary"
+}
+
+export { }