@nulogy/components 11.0.0-beta.4 → 11.0.0

package/dist/src/Alert/Alert.story.d.ts

@@ -3,10 +3,7 @@ declare const _default: {
     title: string;
 };
 export default _default;
-export declare const Danger: () => React.JSX.Element;
-export declare const Informative: () => React.JSX.Element;
-export declare const Success: () => React.JSX.Element;
-export declare const Warning: () => React.JSX.Element;
+export declare const AlertTypes: () => React.JSX.Element;
 export declare const WithACloseButton: {
     (): React.JSX.Element;
     story: {

package/dist/src/Alert/CloseButton.d.ts

@@ -1,6 +1,6 @@
 import React from "react";
 type CloseButtonProps = {
-    onClick: any;
+    onClick?: React.MouseEventHandler<HTMLButtonElement>;
     "aria-label": string;
 };
 declare const CloseButton: ({ onClick, "aria-label": ariaLabel }: CloseButtonProps) => React.JSX.Element;

package/dist/src/AsyncSelect/AsyncSelect.d.ts

@@ -2,11 +2,11 @@ import React, { ReactNode } from "react";
 import Select from "react-select/base";
 import { AsyncProps } from "react-select/async";
 import { GroupBase } from "react-select";
-import { ComponentSize } from "../NDSProvider/ComponentSizeContext";
+import { ComponentVariant } from "../NDSProvider/ComponentVariantContext";
 type AsyncCustomProps<Option, IsMulti extends boolean, Group extends GroupBase<Option>> = {
     autocomplete?: AsyncProps<Option, IsMulti, Group>["isSearchable"];
     labelText?: string;
-    size?: ComponentSize;
+    variant?: ComponentVariant;
     requirementText?: string;
     helpText?: ReactNode;
     disabled?: AsyncProps<Option, IsMulti, Group>["isDisabled"];

package/dist/src/AsyncSelect/AsyncSelectComponents.d.ts

@@ -1,8 +1,8 @@
 import React from "react";
 import { ClearIndicatorProps, ContainerProps, ControlProps, DropdownIndicatorProps, InputProps, MenuProps, MultiValueProps } from "react-select";
 import { GroupBase } from "react-select";
-import { OptionProps } from "react-select";
-import { ComponentSize } from "../NDSProvider/ComponentSizeContext";
+import type { OptionProps } from "react-windowed-select";
+import type { ComponentVariant } from "../NDSProvider/ComponentVariantContext";
 export declare const SelectControl: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>(props: ControlProps<Option, IsMulti, Group>) => React.JSX.Element;
 export declare const SelectMultiValue: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>(props: MultiValueProps<Option, IsMulti, Group>) => React.JSX.Element;
 export declare const SelectClearIndicator: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>(props: ClearIndicatorProps<Option, IsMulti, Group>) => React.JSX.Element;
@@ -11,5 +11,5 @@ export declare const SelectContainer: <Option, IsMulti extends boolean, Group ex
 export declare const SelectInput: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>(props: InputProps<Option, IsMulti, Group>) => React.JSX.Element;
 export declare const SelectMenu: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>(props: MenuProps<Option, IsMulti, Group>) => React.JSX.Element;
 export declare function SelectOption<Option, IsMulti extends boolean, Group extends GroupBase<Option>>(props: OptionProps<Option, IsMulti, Group> & {
-    size?: ComponentSize;
+    variant?: ComponentVariant;
 }): React.JSX.Element;

package/dist/src/AsyncSelect/fixtures.d.ts

@@ -0,0 +1,5 @@
+export declare const loadMatchingProvinces: (inputValue: string) => Promise<any>;
+export declare const provinces: {
+    label: string;
+    value: string;
+}[];

package/dist/src/Box/index.d.ts

@@ -1 +1,2 @@
 export { default as Box, AnimatedBox } from "./Box";
+export type { BoxProps } from "./Box";

package/dist/src/BrandedNavBar/MobileMenu.d.ts

@@ -2,7 +2,7 @@ import React from "react";
 type ThemeColorObject = {
     textColor?: string;
     background?: string;
-    logoColor?: string;
+    logoColor?: "white" | "blue";
 };
 type MenuData = {
     primaryMenu?: any[];
@@ -15,5 +15,5 @@ type BaseMobileMenuProps = {
     themeColorObject?: ThemeColorObject;
     showNulogyLogo?: boolean;
 };
-declare const MobileMenu: import("styled-components").StyledComponent<React.FC<BaseMobileMenuProps>, import("styled-components").DefaultTheme, {}, never>;
+declare const MobileMenu: import("styled-components").StyledComponent<({ menuData, closeMenu, subtext, themeColorObject, showNulogyLogo, ...props }: BaseMobileMenuProps) => React.JSX.Element, import("styled-components").DefaultTheme, {}, never>;
 export default MobileMenu;

package/dist/src/BrandedNavBar/NavBarBackground.d.ts

@@ -3,7 +3,7 @@ import { StyledProps } from "../StyledProps";
 export type NavBarBackgroundProps = {
     theme?: DefaultNDSThemeType;
 } & StyledProps;
-declare const NavBarBackground: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, import("../Box/Box").BoxProps & {
+declare const NavBarBackground: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, import("../Box").BoxProps & {
     gap?: import("csstype").Property.Gap<string | number>;
     rowGap?: import("csstype").Property.RowGap<string | number>;
     columnGap?: import("csstype").Property.ColumnGap<string | number>;

package/dist/src/BrandedNavBar/isValidMenuItem.d.ts

@@ -1,2 +1 @@
-declare const isValidMenuItem: (arr: any, idx: any, componentName: any, location: any, propFullName: any) => Error;
-export default isValidMenuItem;
+export default function isValidMenuItem(arr: any, idx: any, componentName: any, location: any, propFullName: any): Error;

package/dist/src/Branding/BrandingText.d.ts

@@ -1,3 +1,6 @@
-/// <reference types="react" />
-declare const BrandingText: React.FC<any>;
+type BrandingTextProps = {
+    logoColor?: "blue" | "white";
+    size?: "small" | "medium" | "large";
+};
+declare const BrandingText: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, BrandingTextProps, never>;
 export default BrandingText;

package/dist/src/Branding/LettermarkLogo.d.ts

@@ -3,5 +3,5 @@ type LettermarkLogoProps = {
     letterFill?: string;
     size?: string;
 };
-declare const LettermarkLogo: React.FC<LettermarkLogoProps>;
-export default LettermarkLogo;
+export default function LettermarkLogo({ size, letterFill, ...props }: LettermarkLogoProps): React.JSX.Element;
+export {};

package/dist/src/Branding/WordmarkLogo.d.ts

@@ -3,6 +3,7 @@ type WordmarkLogoProps = {
     logoFill?: string;
     letterFill?: string;
     size?: string;
+    children?: React.ReactNode;
 };
-declare const WordmarkLogo: React.FC<WordmarkLogoProps>;
-export default WordmarkLogo;
+export default function WordmarkLogo({ size, logoFill, letterFill, ...props }: WordmarkLogoProps): React.JSX.Element;
+export {};

package/dist/src/Breadcrumbs/Breadcrumbs.d.ts

@@ -1,13 +1,8 @@
 import React from "react";
 import { FlexProps } from "../Flex/Flex";
-import { ComponentSize } from "../NDSProvider/ComponentSizeContext";
-type BreadcrumbsProps = Omit<FlexProps, "size"> & {
-    size?: ComponentSize;
-};
-declare const Breadcrumbs: {
-    ({ size, children, ...props }: BreadcrumbsProps): React.JSX.Element;
-    defaultProps: {
-        as: string;
-    };
+import { ComponentVariant } from "../NDSProvider/ComponentVariantContext";
+type BreadcrumbsProps = FlexProps & {
+    variant?: ComponentVariant;
 };
+declare const Breadcrumbs: ({ variant, as, children, ...props }: BreadcrumbsProps) => React.JSX.Element;
 export default Breadcrumbs;

package/dist/src/Breadcrumbs/Breadcrumbs.story.d.ts

@@ -4,7 +4,6 @@ declare const _default: {
 };
 export default _default;
 export declare const _Breadcrumbs: () => React.JSX.Element;
-export declare const WithDifferentSizes: () => React.JSX.Element;
 export declare const WithoutLink: {
     (): React.JSX.Element;
     story: {

package/dist/src/Breadcrumbs/BreadcrumbsListItem.d.ts

@@ -1,5 +1,5 @@
-import { ComponentSize } from "../NDSProvider/ComponentSizeContext";
+import { ComponentVariant } from "../NDSProvider/ComponentVariantContext";
 export declare const BreadcrumbsListSeparator: import("styled-components").StyledComponent<"li", import("styled-components").DefaultTheme, {}, never>;
 export declare const BreadcrumbsListItem: import("styled-components").StyledComponent<"li", import("styled-components").DefaultTheme, {
-    size: ComponentSize;
+    variant: ComponentVariant;
 }, never>;

package/dist/src/Button/Button.d.ts

@@ -1,17 +1,18 @@
 import React from "react";
 import { SpaceProps } from "styled-system";
 import { DefaultNDSThemeType } from "../theme.type";
-type ComponentSize = "small" | "medium" | "large";
+import { ComponentVariant } from "../NDSProvider/ComponentVariantContext";
 export type ButtonProps = SpaceProps & React.ComponentPropsWithRef<"button"> & {
     className?: string;
     icon?: any;
     iconSide?: "left" | "right";
-    size?: ComponentSize;
+    size?: "small" | "medium";
+    variant?: ComponentVariant;
     fullWidth?: boolean;
     asLink?: boolean;
     children?: React.ReactNode;
     theme?: DefaultNDSThemeType;
     href?: string;
 };
-declare const Button: React.FC<ButtonProps>;
+declare const Button: React.ForwardRefExoticComponent<Omit<ButtonProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
 export default Button;

package/dist/src/Button/CloseButton.d.ts

@@ -1,3 +1,5 @@
 import React from "react";
-declare const CloseButton: React.ForwardRefExoticComponent<Omit<any, "ref"> & React.RefAttributes<unknown>>;
+declare const CloseButton: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
+    ref?: React.Ref<HTMLButtonElement>;
+}, "ref"> & React.RefAttributes<HTMLButtonElement>>;
 export default CloseButton;

package/dist/src/Button/ControlIcon.d.ts

@@ -1,14 +1,13 @@
 import React from "react";
-import { SpaceProps } from "styled-system";
-declare const ControlIcon: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
-    ref?: React.Ref<HTMLButtonElement>;
-} & SpaceProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>, string | number | symbol> & {
-    onClick?: (...args: any[]) => any;
+import { LayoutProps, SpaceProps } from "styled-system";
+type ControlIconProps = React.ComponentPropsWithRef<"button"> & SpaceProps & LayoutProps & {
+    onClick?: React.MouseEventHandler<HTMLButtonElement>;
     icon: string;
     toggled?: boolean;
     disabled?: boolean;
     size?: string;
     type?: string;
     label?: string;
-}, "ref"> & React.RefAttributes<unknown>>;
+};
+declare const ControlIcon: React.ForwardRefExoticComponent<Omit<ControlIconProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
 export default ControlIcon;

package/dist/src/Button/DangerButton.d.ts

@@ -1,4 +1,4 @@
 /// <reference types="react" />
 import { ButtonProps } from "./Button";
-declare const DangerButton: import("styled-components").StyledComponent<import("react").FC<ButtonProps>, import("styled-components").DefaultTheme, {}, never>;
+declare const DangerButton: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<Omit<ButtonProps, "ref"> & import("react").RefAttributes<HTMLButtonElement>>, import("styled-components").DefaultTheme, {}, never>;
 export default DangerButton;

package/dist/src/Button/IconicButton.d.ts

@@ -1,8 +1,8 @@
 import React from "react";
 import { SpaceProps } from "styled-system";
-import { ComponentSize } from "../NDSProvider/ComponentSizeContext";
+import { ComponentVariant } from "../NDSProvider/ComponentVariantContext";
 interface BaseProps {
-    size?: ComponentSize;
+    variant?: ComponentVariant;
     color?: string;
     labelHidden?: boolean;
     icon?: string;

package/dist/src/Button/IconicButton.story.d.ts

@@ -71,7 +71,6 @@ export declare const WithACustomFontSize: {
         name: string;
     };
 };
-export declare const WithDifferentSizes: () => React.JSX.Element;
 export declare const WithNonTextChildren: {
     (): React.JSX.Element;
     story: {

package/dist/src/Button/PrimaryButton.d.ts

@@ -1,3 +1,4 @@
 /// <reference types="react" />
-declare const PrimaryButton: React.FC<any>;
+import { ButtonProps } from "./Button";
+declare const PrimaryButton: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<Omit<ButtonProps, "ref"> & import("react").RefAttributes<HTMLButtonElement>>, import("styled-components").DefaultTheme, {}, never>;
 export default PrimaryButton;

package/dist/src/Button/QuietButton.d.ts

@@ -1,4 +1,4 @@
 /// <reference types="react" />
 import { ButtonProps } from "./Button";
-declare const QuietButton: import("styled-components").StyledComponent<import("react").FC<ButtonProps>, import("styled-components").DefaultTheme, {}, never>;
+declare const QuietButton: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<Omit<ButtonProps, "ref"> & import("react").RefAttributes<HTMLButtonElement>>, import("styled-components").DefaultTheme, {}, never>;
 export default QuietButton;

package/dist/src/ButtonGroup/ButtonGroup.d.ts

@@ -1,8 +1,10 @@
-/// <reference types="react" />
-import { FlexProps } from "../Flex/Flex";
-type ButtonGroupProps = FlexProps & {
+declare const ButtonGroup: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, import("../Box").BoxProps & {
+    gap?: import("csstype").Property.Gap<string | number>;
+    rowGap?: import("csstype").Property.RowGap<string | number>;
+    columnGap?: import("csstype").Property.ColumnGap<string | number>;
+} & {
+    children?: React.ReactNode;
     alignment?: "left" | "spaced" | "right";
     className?: string;
-};
-declare const ButtonGroup: React.FC<ButtonGroupProps>;
+}, never>;
 export default ButtonGroup;

package/dist/src/Card/Card.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
+import React from "react";
 import { BoxProps } from "../Box/Box";
-declare const Card: React.FC<BoxProps>;
-export default Card;
+export default function Card({ borderRadius, boxShadow, py, px, position, children, ...props }: BoxProps): React.JSX.Element;

package/dist/src/Card/CardSet.d.ts

@@ -1,4 +1,6 @@
-import React from "react";
-import { BoxProps } from "../Box/Box";
-declare const CardSet: import("styled-components").StyledComponent<({ children, ...props }: BoxProps) => React.JSX.Element, import("styled-components").DefaultTheme, {}, never>;
+declare const CardSet: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, import("../Box").BoxProps & {
+    gap?: import("csstype").Property.Gap<string | number>;
+    rowGap?: import("csstype").Property.RowGap<string | number>;
+    columnGap?: import("csstype").Property.ColumnGap<string | number>;
+}, never>;
 export default CardSet;

package/dist/src/Checkbox/Checkbox.d.ts

@@ -1,11 +1,12 @@
 import React from "react";
 import { SpaceProps } from "styled-system";
 import { DefaultNDSThemeType } from "../theme.type";
-import { ComponentSize } from "../NDSProvider/ComponentSizeContext";
+import { ComponentVariant } from "../NDSProvider/ComponentVariantContext";
 type NativeInputProps = Omit<React.ComponentPropsWithRef<"input">, "size">;
 type CheckboxProps = NativeInputProps & SpaceProps & {
+    children?: React.ReactNode;
     htmlSize?: number;
-    size?: ComponentSize;
+    variant?: ComponentVariant;
     labelText?: string;
     checked?: boolean;
     defaultChecked?: boolean;
@@ -13,5 +14,5 @@ type CheckboxProps = NativeInputProps & SpaceProps & {
     indeterminate?: boolean;
     theme?: DefaultNDSThemeType;
 };
-declare const Checkbox: React.FC<CheckboxProps>;
+declare const Checkbox: React.ForwardRefExoticComponent<Omit<CheckboxProps, "ref"> & React.RefAttributes<HTMLInputElement>>;
 export default Checkbox;

package/dist/src/Checkbox/Checkbox.story.d.ts

@@ -38,7 +38,6 @@ export declare const SetToRequired: {
         name: string;
     };
 };
-export declare const WithDifferentSizes: () => React.JSX.Element;
 export declare const Indeterminate: {
     (): React.JSX.Element;
     story: {

package/dist/src/Checkbox/CheckboxGroup.d.ts

@@ -1,5 +1,6 @@
 import React from "react";
 interface CheckboxGroupProps {
+    children?: React.ReactNode;
     errorMessage?: string;
     errorList?: string[];
     labelText: string;
@@ -14,5 +15,5 @@ interface CheckboxGroupProps {
     required?: boolean;
     disabled?: boolean;
 }
-declare const CheckboxGroup: React.FC<CheckboxGroupProps>;
-export default CheckboxGroup;
+export default function CheckboxGroup({ className, id, errorMessage, errorList, labelText, helpText, requirementText, ...props }: CheckboxGroupProps): React.JSX.Element;
+export {};

package/dist/src/DatePicker/DatePicker.d.ts

@@ -1,11 +1,11 @@
 import React from "react";
 import type { ReactDatePickerProps } from "react-datepicker";
-import { ComponentSize } from "../NDSProvider/ComponentSizeContext";
+import { ComponentVariant } from "../NDSProvider/ComponentVariantContext";
 import { InputFieldProps } from "../Input/InputField";
 import { FieldProps } from "../Form/Field";
-type OmittedFieldProps = "size" | "onChange" | "onBlur" | "onFocus";
+type OmittedFieldProps = "onChange" | "onBlur" | "onFocus";
 interface DatePickerProps extends Omit<FieldProps, OmittedFieldProps> {
-    size?: ComponentSize;
+    variant?: ComponentVariant;
     onChange?: (date: Date) => void;
     onBlur?: (event: React.FocusEvent<HTMLInputElement>) => void;
     onFocus?: (event: React.FocusEvent<HTMLInputElement>) => void;

package/dist/src/DatePicker/DatePicker.story.d.ts

@@ -15,7 +15,6 @@ export declare const WithCustomDateFormat: {
         name: string;
     };
 };
-export declare const WithDifferentSizes: () => React.JSX.Element;
 export declare const WithCustomPlaceholder: {
     (): React.JSX.Element;
     story: {

package/dist/src/DatePicker/DatePickerHeader.d.ts

@@ -1,11 +1,11 @@
 import React from "react";
-type DatePickerHeaderProps = {
-    date: any;
-    decreaseMonth: (...args: any[]) => any;
-    increaseMonth: (...args: any[]) => any;
+type Props = {
+    date: number;
+    decreaseMonth: React.MouseEventHandler<HTMLButtonElement>;
+    increaseMonth: React.MouseEventHandler<HTMLButtonElement>;
     prevMonthButtonDisabled: boolean;
     nextMonthButtonDisabled: boolean;
     locale?: string;
 };
-declare const DatePickerHeader: React.FC<DatePickerHeaderProps>;
-export default DatePickerHeader;
+export default function DatePickerHeader({ date, decreaseMonth, increaseMonth, prevMonthButtonDisabled, nextMonthButtonDisabled, locale, }: Props): React.JSX.Element;
+export {};

package/dist/src/DatePicker/DatePickerInput.d.ts

@@ -1,11 +1,11 @@
 import React from "react";
 import { InputFieldProps } from "../Input/InputField";
-import { ComponentSize } from "../NDSProvider/ComponentSizeContext";
+import { ComponentVariant } from "../NDSProvider/ComponentVariantContext";
 interface InputProps extends InputFieldProps {
     placeholder?: string;
 }
-type DatePickerInputProps = Omit<React.ComponentPropsWithRef<"input">, "size"> & {
-    size?: ComponentSize;
+type DatePickerInputProps = React.ComponentPropsWithRef<"input"> & {
+    variant?: ComponentVariant;
     dateFormat?: string;
     inputProps?: InputProps;
     onInputChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;

package/dist/src/DatePicker/DatePickerStyles.d.ts

@@ -1 +1,4 @@
-export declare const DatePickerStyles: import("styled-components").GlobalStyleComponent<{}, import("styled-components").DefaultTheme>;
+import { DefaultNDSThemeType } from "../theme.type";
+export declare const DatePickerStyles: import("styled-components").GlobalStyleComponent<{
+    theme: DefaultNDSThemeType;
+}, import("styled-components").DefaultTheme>;

package/dist/src/DateRange/DateRange.d.ts

@@ -1,6 +1,6 @@
 import React from "react";
 import { FieldProps } from "../Form/Field";
-import { ComponentSize } from "../NDSProvider/ComponentSizeContext";
+import { ComponentVariant } from "../NDSProvider/ComponentVariantContext";
 type DateRangeProps = FieldProps & {
     dateFormat?: string;
     onRangeChange?: (...args: any[]) => any;
@@ -30,7 +30,7 @@ type DateRangeProps = FieldProps & {
     disableFlipping?: boolean;
     endTimeProps?: any;
     startTimeProps?: any;
-    size?: ComponentSize;
+    variant?: ComponentVariant;
 };
-declare const DateRange: React.FC<DateRangeProps>;
+declare const DateRange: React.ForwardRefExoticComponent<Omit<DateRangeProps, "ref"> & React.RefAttributes<unknown>>;
 export default DateRange;

package/dist/src/DateRange/DateRange.story.d.ts

@@ -4,7 +4,6 @@ declare const _default: {
 };
 export default _default;
 export declare const Default: () => React.JSX.Element;
-export declare const WithDifferentSizes: () => React.JSX.Element;
 export declare const DefaultStartAndEndDate: () => React.JSX.Element;
 export declare const DisabledRangeValidation: () => React.JSX.Element;
 export declare const WithCustomError: () => React.JSX.Element;

package/dist/src/DateRange/EndTime.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
-declare const EndTime: import("styled-components").StyledComponent<import("react").FC<import("styled-system").SpaceProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>, string | number | symbol> & {
-    size?: import("../NDSProvider/ComponentSizeContext").ComponentSize;
+declare const EndTime: import("styled-components").StyledComponent<import("react").FC<import("react").PropsWithChildren<import("styled-system").SpaceProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>, string | number | symbol> & {
+    variant?: import("../NDSProvider/ComponentVariantContext").ComponentVariant;
     disabled?: boolean;
     value?: string;
     timeFormat?: string;
@@ -20,5 +20,5 @@ declare const EndTime: import("styled-components").StyledComponent<import("react
     onBlur?: (...args: any[]) => any;
     onFocus?: (...args: any[]) => any;
     onClick?: (...args: any[]) => any;
-}>, import("styled-components").DefaultTheme, {}, never>;
+}>>, import("styled-components").DefaultTheme, {}, never>;
 export default EndTime;

package/dist/src/DateRange/StartTime.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
-declare const StartTime: import("styled-components").StyledComponent<import("react").FC<import("styled-system").SpaceProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>, string | number | symbol> & {
-    size?: import("../NDSProvider/ComponentSizeContext").ComponentSize;
+declare const StartTime: import("styled-components").StyledComponent<import("react").FC<import("react").PropsWithChildren<import("styled-system").SpaceProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>, string | number | symbol> & {
+    variant?: import("../NDSProvider/ComponentVariantContext").ComponentVariant;
     disabled?: boolean;
     value?: string;
     timeFormat?: string;
@@ -20,5 +20,5 @@ declare const StartTime: import("styled-components").StyledComponent<import("rea
     onBlur?: (...args: any[]) => any;
     onFocus?: (...args: any[]) => any;
     onClick?: (...args: any[]) => any;
-}>, import("styled-components").DefaultTheme, {}, never>;
+}>>, import("styled-components").DefaultTheme, {}, never>;
 export default StartTime;

package/dist/src/Divider/Divider.d.ts

@@ -1,4 +1,3 @@
-import React from "react";
-import { BoxProps } from "../Box/Box";
-declare const Divider: ({ borderColor, ...props }: BoxProps) => React.JSX.Element;
+import { StyledProps } from "../StyledProps";
+declare const Divider: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, StyledProps, never>;
 export default Divider;

package/dist/src/Divider/Divider.story.d.ts

@@ -1,7 +1,9 @@
 import React from "react";
 declare const _default: {
     title: string;
-    component: ({ borderColor, ...props }: import("../Box/Box").BoxProps) => React.JSX.Element;
+    component: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, import("..").StyledProps, never>;
 };
 export default _default;
-export declare const _Divider: () => React.JSX.Element;
+export declare const Default: () => React.JSX.Element;
+export declare const WithCustomColourAndSpacing: () => React.JSX.Element;
+export declare const WithCustomProperties: () => React.JSX.Element;

package/dist/src/DropdownMenu/DropdownButton.d.ts

@@ -1,11 +1,11 @@
 import React from "react";
 import { DefaultNDSThemeType } from "../theme.type";
 import { StyledProps } from "../StyledProps";
-import { ComponentSize } from "../NDSProvider/ComponentSizeContext";
+import { ComponentVariant } from "../NDSProvider/ComponentVariantContext";
 declare const DropdownButton: import("styled-components").StyledComponent<"button", import("styled-components").DefaultTheme, Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
     ref?: React.Ref<HTMLButtonElement>;
 } & StyledProps & {
-    size?: ComponentSize;
+    variant?: ComponentVariant;
     color?: string;
     theme?: DefaultNDSThemeType;
     hoverColor?: string;

package/dist/src/DropdownMenu/DropdownItem.d.ts

@@ -1,10 +1,7 @@
-/// <reference types="react" />
-import { DefaultNDSThemeType } from "../theme.type";
-type DropdownItemProps = {
-    theme?: DefaultNDSThemeType;
+type Props = {
     color?: string;
     hoverColor?: string;
     bgHoverColor?: string;
 };
-declare const DropdownItem: React.FC<DropdownItemProps>;
+declare const DropdownItem: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, Props, never>;
 export default DropdownItem;

package/dist/src/DropdownMenu/DropdownLink.d.ts

@@ -1,14 +1,12 @@
 import React from "react";
 import { StyledProps } from "../StyledProps";
-import { DefaultNDSThemeType } from "../theme.type";
-import { ComponentSize } from "../NDSProvider/ComponentSizeContext";
-type DropdownLinkProps = React.ComponentPropsWithRef<"a"> & StyledProps & {
+import { ComponentVariant } from "../NDSProvider/ComponentVariantContext";
+interface Props extends React.ComponentPropsWithRef<"a">, StyledProps {
     disabled?: boolean;
-    size?: ComponentSize;
+    variant?: ComponentVariant;
     color?: string;
-    theme?: DefaultNDSThemeType;
     hoverColor?: string;
     bgHoverColor?: string;
-};
-declare const DropdownLink: import("styled-components").StyledComponent<"a", import("styled-components").DefaultTheme, DropdownLinkProps, never>;
+}
+declare const DropdownLink: import("styled-components").StyledComponent<"a", import("styled-components").DefaultTheme, Props, never>;
 export default DropdownLink;

package/dist/src/DropdownMenu/DropdownMenu.d.ts

@@ -1,9 +1,10 @@
 import React from "react";
-import { ComponentSize } from "../NDSProvider/ComponentSizeContext";
+import { ComponentVariant } from "../NDSProvider/ComponentVariantContext";
 import { StyledProps } from "../StyledProps";
-type DropdownMenuProps = {
+declare const DropdownMenu: React.ForwardRefExoticComponent<{
+    children?: React.ReactNode;
     className?: string;
-    size?: ComponentSize;
+    variant?: ComponentVariant;
     id?: string;
     disabled?: boolean;
     trigger?: () => React.FunctionComponentElement<unknown>;
@@ -17,6 +18,5 @@ type DropdownMenuProps = {
     openAriaLabel?: string;
     closeAriaLabel?: string;
     openOnHover?: boolean;
-} & StyledProps;
-declare const DropdownMenu: React.FC<DropdownMenuProps>;
+} & StyledProps & React.RefAttributes<React.Ref<unknown>>>;
 export default DropdownMenu;

package/dist/src/DropdownMenu/DropdownMenu.story.d.ts

@@ -24,7 +24,6 @@ export declare const WithCustomColors: {
         name: string;
     };
 };
-export declare const WithDifferentSizes: () => React.JSX.Element;
 export declare const WithButtonClosingMenu: {
     (): React.JSX.Element;
     story: {

package/dist/src/DropdownMenu/DropdownMenuContainer.d.ts

@@ -8,5 +8,5 @@ type DropdownMenuContainerProps = {
     dataPlacement?: any;
     theme?: DefaultNDSThemeType;
 };
-declare const DropdownMenuContainer: React.FC<DropdownMenuContainerProps>;
+declare const DropdownMenuContainer: React.FC<React.PropsWithChildren<DropdownMenuContainerProps>>;
 export default DropdownMenuContainer;

package/dist/src/DropdownMenu/DropdownText.d.ts

@@ -1,4 +1,8 @@
-import React from "react";
-import { TextProps } from "../Type/Text";
-declare const DropdownText: React.FC<TextProps>;
+declare const DropdownText: import("styled-components").StyledComponent<"p", import("styled-components").DefaultTheme, import("react").HTMLAttributes<HTMLParagraphElement> & {
+    variant?: import("../NDSProvider/ComponentVariantContext").ComponentVariant;
+    inline?: boolean;
+    disabled?: boolean;
+    textTransform?: "-moz-initial" | "inherit" | "initial" | "revert" | "unset" | "none" | "capitalize" | "full-size-kana" | "full-width" | "lowercase" | "uppercase";
+    fontSize?: string;
+} & import("../StyledProps").StyledProps, never>;
 export default DropdownText;