@dfds-ui/react-components 2.0.29 → 2.2.0-alpha.8d87a90d

package/cjs/popper/Popper.d.ts

@@ -1,29 +0,0 @@
-import React from 'react';
-import { PopperProps, PopperPlacementType } from '@mui/material';
-export declare type PopperBaseProps = {
-    open?: boolean;
-    children: React.ReactElement | string;
-    anchorEl?: any;
-    id?: string;
-    placement?: PopperPlacementType;
-    disablePortal?: PopperProps['disablePortal'];
-    /**
-     * By default the max-width will be set to 100%. This will allow for child elements to have a width of 100vw and also
-     * a max-width of 100% so it will not be overflowing the potential vertical scrollbars.
-     *
-     * You can disable this by setting `noMaxWidthRestriction` to `false`
-     */
-    noMaxWidthRestriction?: boolean;
-    role?: string;
-    onClickAway?: (e: any) => void;
-    className?: string;
-    style?: PopperProps['style'];
-    popperRef?: PopperProps['popperRef'];
-    modifiers?: PopperProps['modifiers'];
-};
-export declare const PopperBase: ({ open, children, anchorEl, id, placement, onClickAway, className, noMaxWidthRestriction, ...rest }: PopperBaseProps) => JSX.Element;
-declare type PopperComponentProps = {
-    setAnchorEl: React.Dispatch<React.SetStateAction<HTMLElement | null>>;
-} & Omit<PopperBaseProps, 'onClickAway'>;
-declare const Popper: ({ children, anchorEl, id, setAnchorEl, placement, popperRef, ...rest }: PopperComponentProps) => JSX.Element;
-export default Popper;

package/cjs/popper/index.d.ts

@@ -1 +0,0 @@
-export { default as Popper } from './Popper';

package/cjs/progress-bar/ProgressBar.d.ts

@@ -1,8 +0,0 @@
-/// <reference types="react" />
-export declare type ProgressBarProps = {
-    light?: boolean;
-    indeterminate?: boolean;
-    progress?: number;
-};
-declare const ProgressBar: ({ light, indeterminate, progress }: ProgressBarProps) => JSX.Element;
-export default ProgressBar;

package/cjs/progress-bar/index.d.ts

@@ -1,2 +0,0 @@
-export { default as ProgressBar } from './ProgressBar';
-export * from './ProgressBar';

package/cjs/schedule/ScheduleItem.d.ts

@@ -1,21 +0,0 @@
-import React, { FunctionComponent } from 'react';
-export declare type ListItemProps = {
-    time: string;
-    text: string;
-    backgroundColor?: string;
-};
-export declare const ListItemBase: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: React.ElementType<any> | undefined;
-} & import("./../flexbox/FlexBox").FlexBoxProps & {
-    as?: React.ElementType<any> | undefined;
-} & React.ClassAttributes<HTMLDivElement> & React.HTMLAttributes<HTMLDivElement> & {
-    children?: React.ReactNode;
-} & {
-    theme?: import("@emotion/react").Theme | undefined;
-} & {
-    backgroundColor?: string | undefined;
-}, {}, {}>;
-declare type ScheduleItemComponent = FunctionComponent<ListItemProps>;
-declare const ScheduleItem: ScheduleItemComponent;
-export default ScheduleItem;

package/cjs/schedule/ScheduleList.d.ts

@@ -1,11 +0,0 @@
-import { FunctionComponent } from 'react';
-declare type ScheduleListItem = {
-    time: string;
-    text: string;
-};
-declare type ScheduleListProps = {
-    items: ScheduleListItem[];
-};
-declare type ScheduleListComponent = FunctionComponent<ScheduleListProps>;
-declare const ScheduleList: ScheduleListComponent;
-export default ScheduleList;

package/cjs/schedule/index.d.ts

@@ -1,2 +0,0 @@
-export { default as ScheduleItem } from './ScheduleItem';
-export { default as ScheduleList } from './ScheduleList';

package/cjs/side-sheet/SideSheet.d.ts

@@ -1,57 +0,0 @@
-import React from 'react';
-declare type Variant = 'nested' | 'elevated';
-declare type BackdropEmphasis = 'low' | 'high';
-declare type Align = 'left' | 'right';
-export declare type SideSheetProps = {
-    children?: React.ReactNode;
-    /**
-     * Choose the `width` of the `SideSheet`.
-     */
-    header?: string;
-    /**
-     * Choose the `width` of the `SideSheet`.
-     */
-    width?: string;
-    /**
-     * When you trigger a close.
-     */
-    onRequestClose?: () => void;
-    /**
-     * If set to true, the `SideSheet` is shown.
-     */
-    isOpen: boolean;
-    /**
-     * Choose if the SideSheet should be nested or elevated.
-     */
-    variant?: Variant;
-    /**
-     * Align the elevated SideSheet to left or right.
-     */
-    alignSideSheet?: Align;
-    /**
-     * Style the SideSheet by adding a className to it.
-     */
-    className?: string;
-    /**
-     * Add or remove the backdrop for the elevated side sheet.
-     */
-    backdrop?: boolean;
-    /**
-     * Specify the emphasis of the backdrop.
-     */
-    backdropEmphasis?: BackdropEmphasis;
-    /**
-     * Specify the custom zIndex.
-     */
-    zIndex?: number;
-    /**
-     * Fullscreen on large mobile (breakpoint at 500px).
-     */
-    largeMobileFullScreen?: boolean;
-    /**
-     * Fullscreen on small mobile (breakpoint at 375px).
-     */
-    smallMobileFullScreen?: boolean;
-};
-declare const SideSheet: ({ variant, className, isOpen, backdrop, width, header, zIndex, largeMobileFullScreen, smallMobileFullScreen, onRequestClose, backdropEmphasis, alignSideSheet, children, ...rest }: SideSheetProps) => JSX.Element;
-export default SideSheet;

package/cjs/side-sheet/SideSheetCloseButton.d.ts

@@ -1,13 +0,0 @@
-import React from 'react';
-import { IconButtonSize } from '../button/IconButton';
-export declare type SideSheetCloseButtonProps = {
-    onRequestClose?: () => void;
-    className?: string;
-    icon?: React.ElementType;
-    size?: IconButtonSize;
-    tabIndex?: number;
-    closeLabel?: string;
-    children?: React.ReactNode;
-};
-export declare const SideSheetCloseButton: ({ onRequestClose, className, icon, size, closeLabel, ...rest }: SideSheetCloseButtonProps) => JSX.Element;
-export default SideSheetCloseButton;

package/cjs/side-sheet/SideSheetContent.d.ts

@@ -1,7 +0,0 @@
-import { ReactNode } from 'react';
-export declare type SideSheetFooterProps = {
-    className?: string;
-    children?: ReactNode;
-};
-export declare const SideSheetContent: ({ children, className, ...rest }: SideSheetFooterProps) => JSX.Element;
-export default SideSheetContent;

package/cjs/side-sheet/SideSheetFooter.d.ts

@@ -1,7 +0,0 @@
-import { ReactNode } from 'react';
-export declare type SideSheetFooterProps = {
-    className?: string;
-    children?: ReactNode;
-};
-export declare const SideSheetFooter: ({ children, className, ...rest }: SideSheetFooterProps) => JSX.Element;
-export default SideSheetFooter;

package/cjs/side-sheet/SideSheetHeader.d.ts

@@ -1,9 +0,0 @@
-import { ReactNode } from 'react';
-export declare type ModalHeaderProps = {
-    className?: string;
-    sticky?: boolean;
-    children?: ReactNode;
-    noDivider?: boolean;
-};
-export declare const SideSheetHeader: ({ children, className, sticky, noDivider, ...rest }: ModalHeaderProps) => JSX.Element;
-export default SideSheetHeader;

package/cjs/side-sheet/SideSheetHeadline.d.ts

@@ -1,7 +0,0 @@
-import { ReactNode } from 'react';
-export declare type SideSheetHeadlineProps = {
-    className?: string;
-    children?: ReactNode;
-};
-export declare const SideSheetHeadline: ({ className, children }: SideSheetHeadlineProps) => JSX.Element;
-export default SideSheetHeadline;

package/cjs/side-sheet/index.d.ts

@@ -1,4 +0,0 @@
-export { default as SideSheet } from './SideSheet';
-export { default as SideSheetFooter } from './SideSheetFooter';
-export { default as SideSheetContent } from './SideSheetContent';
-export * from './SideSheet';

package/cjs/site-layout/SiteLayout.d.ts

@@ -1,36 +0,0 @@
-import React from 'react';
-declare type RenderAs = {
-    as?: React.ElementType;
-};
-declare type LayoutProps = {
-    fullWidth?: boolean;
-    className?: string;
-} & RenderAs;
-declare type LayoutChildProps = {
-    fullWidth?: boolean;
-    className?: string;
-} & RenderAs;
-export declare const LayoutGrid: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: React.ElementType<any> | undefined;
-} & {
-    fullWidth?: boolean | undefined;
-    className?: string | undefined;
-} & RenderAs, React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export declare const Layout: React.FunctionComponent<LayoutProps>;
-export declare const LayoutHeader: React.FunctionComponent<LayoutChildProps>;
-export declare const LayoutMain: React.FunctionComponent<LayoutChildProps>;
-export declare const LayoutFooter: React.FunctionComponent<LayoutChildProps>;
-declare const _default: {
-    Grid: import("@emotion/styled").StyledComponent<{
-        theme?: import("@emotion/react").Theme | undefined;
-        as?: React.ElementType<any> | undefined;
-    } & {
-        fullWidth?: boolean | undefined;
-        className?: string | undefined;
-    } & RenderAs, React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-    Header: React.FunctionComponent<LayoutChildProps>;
-    Main: React.FunctionComponent<LayoutChildProps>;
-    Footer: React.FunctionComponent<LayoutChildProps>;
-};
-export default _default;

package/cjs/site-layout/index.d.ts

@@ -1,2 +0,0 @@
-export { default as SiteLayout } from './SiteLayout';
-export * from './SiteLayout';

package/cjs/skeleton/Skeleton.d.ts

@@ -1,8 +0,0 @@
-/// <reference types="react" />
-export interface SkeletonProps {
-    variant: SkeletonVariant;
-    disableAnimation?: boolean;
-}
-export declare type SkeletonVariant = 'text' | 'circle' | 'rect';
-export declare const Skeleton: ({ variant, disableAnimation, ...rest }: SkeletonProps) => JSX.Element;
-export default Skeleton;

package/cjs/skeleton/index.d.ts

@@ -1 +0,0 @@
-export * from './Skeleton';

package/cjs/social-media-link-list/SocialMediaLinkList.d.ts

@@ -1,26 +0,0 @@
-import React, { FunctionComponent } from 'react';
-export declare type SocialMediaLinkListProps = {
-    instagramLink?: string;
-    facebookLink?: string;
-    blogLink?: string;
-    twitterLink?: string;
-    linkedinLink?: string;
-    youtubeLink?: string;
-    mailshareLink?: string;
-    iconSize?: string;
-    noPadding?: boolean;
-    colorOverwrite?: string;
-};
-export declare const SoMeWrapper: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: React.ElementType<any> | undefined;
-} & import("../flexbox/FlexBox").FlexBoxProps & {
-    as?: React.ElementType<any> | undefined;
-} & React.ClassAttributes<HTMLDivElement> & React.HTMLAttributes<HTMLDivElement> & {
-    children?: React.ReactNode;
-} & {
-    theme?: import("@emotion/react").Theme | undefined;
-} & SocialMediaLinkListProps, {}, {}>;
-declare type socialMediaLinkListComponent = FunctionComponent<SocialMediaLinkListProps>;
-export declare const SocialMediaLinkList: socialMediaLinkListComponent;
-export default SocialMediaLinkList;

package/cjs/social-media-link-list/index.d.ts

@@ -1 +0,0 @@
-export * from './SocialMediaLinkList';

package/cjs/spinner/Spinner.d.ts

@@ -1,58 +0,0 @@
-/// <reference types="react" />
-import { PolymorphicComponentProps } from '../common/polymorphic';
-declare type Color = 'dark' | 'secondary' | 'light';
-export declare type SpinnerProps = {
-    /**
-     * Indicates that Spinner will show up instantaneously (instead of fading in).
-     *
-     */
-    instant?: boolean;
-    /**
-     * Specifies the size of the Spinner.
-     *
-     * @deprecated Use css instead.
-     */
-    size?: string;
-    /**
-     * Class name to be assigned to component.
-     */
-    className?: string;
-    /**
-     * Set the color variant to use.
-     */
-    color?: Color;
-} & PolymorphicComponentProps;
-/**
- * A spinner is used to give user a sense of progress, when the time required to complete the given task is not known.
- */
-export declare function Spinner({ instant, size, className, color, as, ...rest }: SpinnerProps): JSX.Element;
-export declare namespace Spinner {
-    var displayName: string;
-}
-/**
- * @deprecated Style the regular spinner to achieve the desired effect.
- */
-export declare const CenteredSpinner: import("@emotion/styled").StyledComponent<{
-    /**
-     * Indicates that Spinner will show up instantaneously (instead of fading in).
-     *
-     */
-    instant?: boolean | undefined;
-    /**
-     * Specifies the size of the Spinner.
-     *
-     * @deprecated Use css instead.
-     */
-    size?: string | undefined;
-    /**
-     * Class name to be assigned to component.
-     */
-    className?: string | undefined;
-    /**
-     * Set the color variant to use.
-     */
-    color?: Color | undefined;
-} & PolymorphicComponentProps & {
-    theme?: import("@emotion/react").Theme | undefined;
-}, {}, {}>;
-export default Spinner;

package/cjs/spinner/index.d.ts

@@ -1 +0,0 @@
-export * from './Spinner';

package/cjs/step/Step.d.ts

@@ -1,45 +0,0 @@
-import React, { ReactNode } from 'react';
-export declare type StepProps = {
-    /**
-     * 	The position of the step
-     */
-    index: number;
-    /**
-     * Step label
-     */
-    label?: string;
-    /**
-     * 	Sets the step as active
-     */
-    active?: boolean;
-    /**
-     * 	Sets the step as completed
-     */
-    completed?: boolean;
-    /**
-     * If `true`, the step button will be disabled
-     */
-    disabled?: boolean;
-    /**
-     * Should be Step sub-components, such as `StepContent` for the vertical variant
-     */
-    children?: ReactNode;
-    /**
-     * Optional label. Is shown below the step label
-     */
-    optionalStepText?: string;
-    /**
-     * Error step. Error icon will be showen in the step button
-     */
-    hasError?: boolean;
-    /**
-     * Editing step. Editing icon wil be showen in the step button
-     */
-    isEditing?: boolean;
-    /**
-     * The function is triggered when step button is clicked
-     */
-    handleStepClick?: () => void;
-};
-declare const _default: React.MemoExoticComponent<({ index, label, active: activeProp, completed: completedProp, disabled, children, hasError, optionalStepText, isEditing, handleStepClick, ...props }: StepProps) => JSX.Element>;
-export default _default;

package/cjs/step/Step.styles.d.ts

@@ -1,4 +0,0 @@
-export declare const stepWrapperHorizontalStyles: import("@emotion/utils").SerializedStyles;
-export declare const stepWrapperVerticalStyles: import("@emotion/utils").SerializedStyles;
-export declare const stepHeaderStyles: import("@emotion/utils").SerializedStyles;
-export declare const stepContentStyles: import("@emotion/utils").SerializedStyles;

package/cjs/step/StepButton.d.ts

@@ -1,4 +0,0 @@
-import React from 'react';
-declare type StepButtonProps = React.ButtonHTMLAttributes<HTMLButtonElement>;
-declare const StepButton: React.FC<StepButtonProps>;
-export default StepButton;

package/cjs/step/StepContent.d.ts

@@ -1,6 +0,0 @@
-import { ReactNode } from 'react';
-declare type StepContentProps = {
-    children: ReactNode;
-};
-declare const StepContent: ({ children }: StepContentProps) => JSX.Element;
-export default StepContent;

package/cjs/step/StepContext.d.ts

@@ -1,12 +0,0 @@
-import React, { ReactNode } from 'react';
-export declare type StepContextType = {
-    index: number;
-    active: boolean;
-    hasError?: boolean;
-    completed?: boolean;
-    disabled?: boolean;
-    isEditing?: boolean;
-    feedback?: ReactNode;
-};
-declare const StepContext: React.Context<StepContextType>;
-export default StepContext;

package/cjs/step/StepLabel.d.ts

@@ -1,7 +0,0 @@
-import { FC, ReactNode } from 'react';
-declare type StepLableTypes = {
-    children: ReactNode;
-    optionalStepText?: ReactNode;
-};
-declare const StepLabel: FC<StepLableTypes>;
-export default StepLabel;

package/cjs/step/index.d.ts

@@ -1 +0,0 @@
-export { default as Step } from './Step';

package/cjs/stepper/Stepper.d.ts

@@ -1,25 +0,0 @@
-import React, { ReactNode } from 'react';
-export declare type StepperProps = {
-    /**
-     * Stepper layout orientation `'horizontal' | 'vertical'`
-     */
-    orientation?: 'horizontal' | 'vertical';
-    /**
-     * Multiple `<Step/>` components
-     */
-    children: ReactNode;
-    /**
-     *  The initial step
-     */
-    activeStep?: number;
-    /**
-     *  If set the component will not assist in controlling steps for sequential flow
-     */
-    sequential?: boolean;
-    /**
-     * A feedback message can be passed to display a transitory feedback message as the step label
-     */
-    stepFeedbackMessage?: string;
-};
-declare const _default: React.MemoExoticComponent<({ children, activeStep, sequential, orientation, stepFeedbackMessage, ...other }: StepperProps) => JSX.Element>;
-export default _default;

package/cjs/stepper/StepperContext.d.ts

@@ -1,9 +0,0 @@
-import React from 'react';
-declare type StepperContextType = {
-    activeStep: number;
-    orientation: 'horizontal' | 'vertical';
-    sequential: boolean;
-    stepFeedbackMessage?: string;
-};
-declare const StepperContext: React.Context<StepperContextType>;
-export default StepperContext;

package/cjs/stepper/index.d.ts

@@ -1 +0,0 @@
-export { default as Stepper } from './Stepper';

package/cjs/stepper-feedback-message/StepperFeedbackMessage.d.ts

@@ -1,5 +0,0 @@
-/// <reference types="react" />
-declare const StepperFeedbackMessage: ({ message }: {
-    message: string;
-}) => JSX.Element;
-export default StepperFeedbackMessage;

package/cjs/stepper-feedback-message/index.d.ts

@@ -1 +0,0 @@
-export { default as StepperFeedbackMessage } from './StepperFeedbackMessage';

package/cjs/styles/index.d.ts

@@ -1,3 +0,0 @@
-export { default as legacyMedia, legacyGenerateMedia } from './media';
-export { default as theme } from './theme';
-export { visuallyHidden } from './style-helpers';

package/cjs/styles/media.d.ts

@@ -1,21 +0,0 @@
-declare const defaultBreakPoints: {
-    xl: number;
-    lg: number;
-    md: number;
-    sm: number;
-    xs: number;
-};
-declare type BreakPoint = keyof typeof defaultBreakPoints | number;
-export declare function legacyGenerateMedia(breakPoints: typeof defaultBreakPoints): {
-    lt: (breakPoint: BreakPoint) => string;
-    gt: (breakPoint: BreakPoint) => string;
-    bt: (firstBreakpoint: BreakPoint, secondBreakpoint: BreakPoint) => string;
-    tablet: () => string;
-};
-export declare const legacyMedia: {
-    lt: (breakPoint: BreakPoint) => string;
-    gt: (breakPoint: BreakPoint) => string;
-    bt: (firstBreakpoint: BreakPoint, secondBreakpoint: BreakPoint) => string;
-    tablet: () => string;
-};
-export default legacyMedia;

package/cjs/styles/rem.d.ts

@@ -1 +0,0 @@
-export declare const rem: (targetPixelValue: number, base?: number) => string;

package/cjs/styles/style-helpers.d.ts

@@ -1 +0,0 @@
-export declare const visuallyHidden: () => import("@emotion/utils").SerializedStyles;

package/cjs/styles/theme.d.ts

@@ -1,39 +0,0 @@
-export declare const theme: {
-    colors: {
-        yesGreen: string;
-        cautionAmber: string;
-        noRed: string;
-        linkBlue: string;
-        linkHover: string;
-        actionBlue: string;
-        actionHover: string;
-        actionMedium: string;
-        actionLight: string;
-        primaryOrange: string;
-        primaryHover: string;
-        uiEnabled: string;
-        uiDisabled: string;
-        textGrey: string;
-        textMedium: string;
-        textLight: string;
-        groupBlue: string;
-        groupMedium: string;
-        groupLight: string;
-        backgroundGrey: string;
-        white: string;
-        whiteHover: string;
-    };
-    fontFamily: string;
-    spacing: {
-        xxs: string;
-        xs: string;
-        s: string;
-        m: string;
-        l: string;
-        xl: string;
-        xxl: string;
-    };
-    uiRoundness: string;
-};
-export declare type ThemeInterface = typeof theme;
-export default theme;

package/cjs/surface/Surface.d.ts

@@ -1,32 +0,0 @@
-import React from 'react';
-import { theme } from '@dfds-ui/theme';
-export declare type SurfaceType = keyof typeof theme.colors.surface;
-export declare type SurfaceContextType = {
-    surface: SurfaceType;
-    backgroundColor: string;
-    textColors: {
-        primary: string;
-        secondary: string;
-        disabled: string;
-    };
-};
-export declare function getTextColors(surface: SurfaceType): {
-    primary: string;
-    secondary: string;
-    disabled: string;
-};
-export declare function getBackgroundColor(surface: SurfaceType): string;
-export declare const SurfaceContext: React.Context<SurfaceContextType | undefined>;
-export declare const SurfaceProvider: React.FC<{
-    surface: SurfaceType;
-    children?: React.ReactNode;
-}>;
-export declare function MaybeSurfaceProvider({ surface, ...rest }: React.PropsWithChildren<{
-    surface?: SurfaceType;
-}>): JSX.Element;
-export declare const useSurfaceContext: (surface?: SurfaceType) => SurfaceContextType;
-export declare const Surface: React.FC<{
-    surface: SurfaceType;
-    className?: string;
-    children?: React.ReactNode;
-}>;

package/cjs/surface/index.d.ts

@@ -1 +0,0 @@
-export * from './Surface';

package/cjs/tab/Tab.d.ts

@@ -1,12 +0,0 @@
-import React from 'react';
-export declare type Index = number | string;
-export declare type TabProps = {
-    active?: boolean;
-    disabled?: boolean;
-    transparent?: boolean;
-    index: Index;
-    onClick?: React.MouseEventHandler<HTMLButtonElement>;
-    children?: React.ReactNode;
-};
-declare const Tab: React.FC<TabProps>;
-export default Tab;

package/cjs/tab/TabPanel.d.ts

@@ -1,7 +0,0 @@
-import React from 'react';
-declare type TabPanelProps = {
-    index: number | string;
-    children: React.ReactNode;
-};
-declare const TabPanel: React.FC<TabPanelProps>;
-export default TabPanel;

package/cjs/tab/Tabs.d.ts

@@ -1,11 +0,0 @@
-import React from 'react';
-declare type TabsLabels = {
-    scrollLeft: string;
-    scrollRight: string;
-};
-declare type TabsProps = {
-    tabsLabels?: TabsLabels;
-    children?: any;
-};
-declare const Tabs: React.FC<TabsProps>;
-export default Tabs;

package/cjs/tab/TabsContext.d.ts

@@ -1,16 +0,0 @@
-import React, { ReactNode } from 'react';
-import { Index } from './Tab';
-export declare type TabsContextProps = {
-    transparent?: boolean;
-    onChange?: (index: any) => void;
-    size?: 's' | 'm';
-    activeTab?: Index | undefined;
-    children?: React.ReactNode;
-};
-export declare const TabsContext: React.Context<TabsContextProps>;
-export declare const TabsContextProvider: React.FC<{
-    value: TabsContextProps;
-    children?: ReactNode;
-}>;
-export declare const useTabsContext: () => TabsContextProps;
-export default useTabsContext;